CSS-2.1-CSS单位

最新推荐文章于 2025-05-16 21:49:52 发布
原创 最新推荐文章于 2025-05-16 21:49:52 发布 · 230 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#CSS单位 #CSS绝对单位 #CSS相对单位

本文详细解析了CSS中的单位系统，包括绝对单位如英寸(in)、厘米(cm)、毫米(mm)、点(pt)、皮卡(pc)，以及相对单位如像素(px)、em、百分比(%)。了解这些单位如何影响网页布局和设计，对于掌握CSS样式至关重要。

CSS-2.1-CSS单位

注意事项
1.HTML中的单位只有一种，是像素px，所以可以省略
2.CSS没有默认单位，必须要写上，否则无效

1、绝对单位

  • 1 in = 2.54 cm = 25.4 mm = 72 pt = 6 pc
  • in
    • 英寸lnches(1英寸=2.54厘米)
  • cm
    • 厘米Centimeters
  • mm
    • 毫米Millimeters
  • pt
    • 点Points,英镑(1点=1/72英寸)
  • pc
    • 皮卡Picas(1皮卡=12点)

2、相对单位

  • px
    • 像素
  • em
    • 印刷单位相当于12个点
  • %
    • 百分比，相对周围的文字大小
全面学习CSS手册2.1
06-01
CSS手册2.1，学习CSS最好不过了，不要错过哦
esapi-2.1.0.1.zip（esapi-2.1.0.1.jar）
12-24
ESAPI提供了多种编码方法，例如HTML、URL、JavaScript和CSS编码，能够在处理用户输入时防止恶意代码被执行，从而有效防范XSS攻击。通过使用ESAPI，开发者可以确保输出到用户浏览器的数据是安全的，避免了潜在的代码...
CSS回顾-长度单位汇总详解
懒羊羊我小弟的博客
11-14 1675
本文详细介绍了 CSS 中的长度单位。包括绝对长度单位（px、cm、mm、in、pt、pc）和相对长度单位（em、rem、%、vw、vh、vmin、vmax）。阐述了它们的定义、应用场景、优缺点，并对比了绝对长度单位与相对长度单位，指出绝对长度单位有固定参照，相对长度单位基于其他元素属性计算，在响应式设计中各有特点。
CSS- 2.1 实战之图文混排、表格、表单、学校官网一级导航栏
最新发布
HRDMN的博客
05-16 1567
文章列举了css实战的三个系列：图文混排、表格以及表单，每个实战都分为理论部分和实战代码部分，方便大家夯实基础的同时，用代码练手。文章还涉及到了很多理论，大家都会在后续的学习中遇到，不要着急，先跟着小编开启今天的练习吧！
基于css-vars-ponyfill实现换肤
小马甲
02-10 2119
自定义变量颜色：对于业务来说，可能基础色并不能满足所有业务的颜色覆盖，或者每种主题下基础色并不能一一对应，此时自定义变量颜色，这个功能变得必不可少。主要原理也是根据每种主题可以自己填写对应的业务需要的颜色（极端情况），这边也分以下两种情景：（1）完全自定义常量多态，即一种主题色自定义常量都有对应一种颜色例如 系统主题有四种，某个业务背景色，我们定义了一个常量dark1主题下的颜色是一个基础色dark.C01；dark2主题下的颜色是一个基础色dark.C02；light1主题下的颜色是一个基础色。
css-doodle 学习第二天，css-doodle能怎么使用
qq_36418362的博客
05-03 1882
1、我们能怎么来使用css-doodle css-doodle的使用有如下几种 1.1、Grid（表格形式） 1.2、Selectors（选择器形式） 1.3、Properties（属性形式） 1.4、Functions（功能（函数）形式） 1.5、JS API（应该是引用其它API形式） 2、Grid 2.1、先看一段使用Grid的代码（官网代码，size属性是我自己加的，这些属...
amfe-flexible&postcss-pxtorem在react项目中的使用
qq_43570260的博客
04-02 1880
PostCSS 是一个用 JavaScript 编写的工具，用于将 CSS 转换为另一种 CSS，常结合插件一起使用，像 autoprefixer （自动添加浏览器前缀）、 cssnano （压缩 CSS 代码）等。通过创建一个 craco.config.js 文件，在其中定义需要覆盖的配置项，就可以在不破坏 CRA 封装性的前提下修改 PostCSS 配置。- 缺点 ：这是一个不可逆的操作，一旦执行 eject ，就无法再享受 CRA 自动更新默认配置的便利，后续项目维护和升级的复杂度会增加。
手把手教你webpack3（6）css-loader详细使用说明
qq20004604的博客
12-01 3975
CSS-LOADER配置详解前注：文档全文请查看 根目录的文档说明。如果可以，请给本项目加【Star】和【Fork】持续关注。有疑义请点击这里，发【Issues】。1、概述对于一般的css文件，我们需要动用三个loader（是不是觉得好麻烦）；1、css-loader：先附上官网文档（中文）的链接：css-loader文档。不过说实话，这个官方文档讲的很糟糕，看的人一脸懵逼。css-loader主要
css2.1--笔记1（定位、浮动、三列布局）
ABU_MOlI_ITUI的博客
07-27 5529
定位： 浮动元素的包含块为离他最近的块级祖先元素。 “根元素”的包含块也被称作初始包含块，在HTML里根元素就是html元素，当然大多数初始包含块是一个视窗大小的矩形，但是初始包含块不是视窗大小。 对于非根元素，如果其position值是relative或static，包含块则由最近的块级包含，也就是用div包含。 对于非根元素，如果其position值是absolute，包含块设置为position值不是static的祖先元素。 ----如果祖先元素是块级元素，包含块则设置成该元素的内边距边界，
postcss-loader
qq_41893334的博客
05-21 9799
1.什么是PostCSS? https://www.postcss.com.cn/ PostCSS和sass/less不同, 它不是CSS预处理器 PostCSS是一款使用插件去转换CSS的工具， PostCSS有许多非常好用的插件 例如 autoprefixer(自动补全浏览器前缀) postcss-pxtorem(自动把px代为转换成rem) … … 2.使用PostCSS自动补全浏览器前缀 2.1安装postcss-loader npm i -D postcss-loader 2.2安装需要的插件 n
ABC JS-CSS Injector-2.1
12-15
版本：2.1 作者：abcelearning 分类：其他 -------------------- 概述：脚本和样式注入的最佳且更快的解决方案。 描述： 脚本和样式注入的最佳且更快的解决方案。 在特定网站或所有域中执行javascript/jquery脚本或...
pdfjs-2.1.266-dist.zip
03-18
"pdfjs-2.1.266-dist.zip" 是这个库的一个发行版，包含了运行 PDF.js 所需的所有资源和文件，版本号为 2.1.266。 PDF.js 的核心功能在于它能够将 PDF 文件转换成可以在 Web 上浏览的 HTML5/CSS 渲染格式。这使得...
web-studio-2.1-test
03-18
"web-studio-2.1-test" 这个标题暗示我们正在探讨的是一款名为 "Web Studio" 的软件的2.1测试版本。Web Studio很可能是一个集成开发环境（IDE），专门用于构建Web应用，特别是HTML相关的项目。这个测试版本可能是...
CSS-In-JS
打工人
02-08 9251
CSS-In-JS Emotion
ABC JS-CSS Injector-2.1：网站脚本与样式注入工具
资源摘要信息:"ABC JS-CSS Injector-2.1是一个由abcelearning开发的Chrome扩展程序，主要用于在特定网站或所有域中执行javascript/jquery脚本或CSS样式。它的版本是2.1，分类为其他。这个扩展是一个非常强大的脚本和...
JavaScript-3.5-JavaScript 函数-案例
QWH_PYTHON的博客
10-24 1060
JavaScript-3.5-JavaScript 函数-案例案例一：使用函数实现计算机功能二：递归 案例 一：使用函数实现计算机功能 使用 prompt 输入两个数和运算符号，计算两个数的操作结果 使用 switch 判断运算符号，调用函数计算两数结果 <!DOCTYPE html> <html lang="en"> <head> <meta ch...
HTML-1.1-HTML的介绍
QWH_PYTHON的博客
09-03 870
HTML-1.1-HTML的介绍一：HTML概述二：HTML的作用三：HTML的历史四：HTML的网络术语五：计算机编码的介绍1、ASCII码2、ANSI编码3、GBK4、Unicode编码（统一编码）5、UTF-8(Unicode Transform Format)编码6、中文能够使用的两种字符集7、避免乱码8、UTF-8和GB2313的比较六：HTML颜色介绍1、颜色表示2、RGB色彩模式 一...
JavaScript-3.1-JavaScript 函数-函数的声明与调用
QWH_PYTHON的博客
10-18 801
JavaScript-3.0-JavaScript 函数-函数的声明与调用函数的声明与调用一：函数的声明1、有参函数2、无参函数二：函数的调用三：函数的作用域四：函数声明和调用的注意事项五：函数声明与函数调用没有先后之分 函数的声明与调用 函数的主要作用是将程序中需要重复使用的代码进行封装，从而可以使代码重复使用 函数的使用 声明 调用 一：函数的声明 在 JavaScript 中，函...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值