calc()使用通用的数学运算规则，但是也提供更智能的功能： >使用“+”、“-”、“*” 和 “/”四则运算； >可以使用百分比、px、em、rem等单位； >可以混合使用各种单位进行计算； >表达式中有“+”和“-”时，其前后必须要有空格，如"widht: calc(12%+5em)"这种没有空
转载
2020-07-03 09:46:00
304阅读
2评论
考虑到未来响应式设计的开发，如果你需要，浏览器的高度也可以基于百分比值调整。但使用基于百分比值并不总是相对于浏览器窗口的大小定义的最佳方式，比如字体大小不会随着你窗口改变而改变，如今css3引入的新单位明确解决这一问题。 View Demo css3引入的”vw”和”vh”基于宽度/高度相对于窗口大
转载
2017-04-29 21:39:00
391阅读
2评论
height：100%是铺满父容器的高度。height：100vh是指铺满屏幕的高度。
原创
2023-06-05 13:56:51
388阅读
vh确实是相对于屏幕的，但默认body有一个margin，100%加上这个margin就超出了。清除body的margin即可。 body { margin: 0; } ...
转载
2021-09-21 17:05:00
5178阅读
2评论
px px就是pixel像素的缩写，相对长度单位，网页设计常用的基本单位。像素px是相对于显示器屏幕分辨率而言的 em em是相对长度单位。相对于当前对象内文本的字体尺寸（参考物是父元素的font-size） 如当前父元素的字体尺寸未设置，则相对于浏览器的默认字体尺寸 特点： 1. em的值并不是固 ...
转载
2021-07-12 15:37:00
662阅读
2评论
众所周知，在从css3中，vh和wh 指的是浏览器可见区域。1vw 等于视窗总宽度的1%1vh 等于视窗总高度的1%移动端使用vh 遇到的问题由于，各种浏览器的计算高度不一样，譬如 Safari 浏览器会计算底部或顶部的地址栏。因此，会出现页面底部元素隐藏不显示的问题。解决方案安装 vh-check 插件npm i vh-check -s复制代码在 main.js 中引入import vhChec
原创
精选
2022-12-08 22:42:42
434阅读
/* px：绝对单位，页面按精确像素展示 em：相对单位，基准点为父节点字体的大小，如果自身定义了font-size按自身来计算（浏览器默认字体是16px），整个页面内1em不是一个固定的值。 rem：相对单位，可理解为”root em”, 相对根节点html的字体大小来计算，CSS3新加属性，ch ...
转载
2021-10-12 09:09:00
921阅读
前言 在传统项目开发中，我们只会用到 px、%、em 这几个单位长度，它们可以适用大部分项目的开发，并且拥有较好的兼容性。 而从 css3 开始，浏览器对逻辑单位的支持又提升了新的境界，增加了 rem、vh、vw、vm 等新的单位长度。 新技术的出现必然是为了解决旧技术存在的问题和不便，我们利用这些
原创
2022-11-26 10:06:17
10000+阅读
html 加载时发生了什么 在页面加载时，浏览器把获取到的HTML代码解析成1个DOM树，DOM树里包含了所有HTML标签，包括display:none隐藏，还有用JS动态添加的元素等。 浏览器把所有样式(用户定义的CSS和用户代理)解析成样式结构体 DOM Tree 和样式结构体组合后构建render tree, render tree类似于DOM tree，但区别很大，因为render tre
px、em、rem、%、vw、vh单位 1 、px px就是pixel（像素）的缩写。但是在设备本身上，PX 单元是固定的，不会根据任何其他元素进行更改。对于响应式站点，使用 PX 可能会出现问题，但它们对于保持某些元素的大小一致很有用。如果你有不应调整大小的元素，那么使用 PX 是一个不错的选择。
转载
2022-12-18 01:44:00
445阅读
css
原创
2022-09-03 01:43:51
609阅读
css3自适应布局单位vw,vh一、总结一句话总结：vw和vh都是视图单位，分别为视图宽高的1% 1、vh/vw与%区别？%是相对于父元素，vh和vw是相对于视图高宽% 百分比，相对长度单位，相对于父元素的百分比值vh和vw相对于视口的高度和宽度 二、css3自适应布局单位vw,vh你知道多少？视口单位(Viewport units)什么是视口？ 在PC端，视口指的是在PC端，指的是浏览器的可
转载
2019-12-05 15:35:00
349阅读
2评论
CSS中预设了16种颜色以及16种颜色的衍生色，这16种颜色是CSS规范推荐的。并且一些主流的浏览器都可以识别。例如以下表所看到的： 十六进制颜色是最经常使用的定义方式。它的基本格式为#RRGGBB,R、G、B分别代表红绿蓝。也可以用RGB(R,G,B)设置颜色。參数用0～255的十进制数表示 为保
转载
2016-04-03 13:55:00
102阅读
2评论
1，vw、vh、vmin、vmax 的含义 （1）vw、vh、vmin、vmax 是一种视窗单位，也是相对单位。它相对的不是父节点或者页面的根节点。而是由视窗（Viewport）大小来决定的，单位 1，代表类似于 1%。 视窗(Viewport)是你的浏览器实际显示内容的区域—，换句话说是你的不包括
转载
2018-05-31 23:21:00
102阅读
1、px 像素，我们在网页布局中一般都是用px。 2、百分比 百分比一般宽泛的讲是相对于父元素，自适应网页布局越来越多，百分比也经常用到了。 3、Viewport viewport：可视窗口，也就是浏览器。 vw Viewport宽度， 1vw 等于viewport宽度的1% vh Viewport
转载
2019-05-21 10:28:00
1711阅读
2评论
Viewport viewport：可视窗口，也就是浏览器。 vw Viewport宽度， 1vw 等于viewport宽度的1% vh Viewport高度， 1vh 等于viewport高的的1%CSS3使用Calccalc()使用通用的数学运算规则，但是也提供更智能的功能： 使用
原创
2022-08-31 21:52:48
525阅读
考虑到未来响应式设计的开发，如果你需要，浏览器的高度也可以基于百分比值调整。但使用基于百分比值并不总是相对于浏览器窗口的大小定义的最佳方式，比如字体大小不会随着你窗口改变而改变，如今css3引入的新单位明确解决这一问题。css3引入的”vw”和”vh”基于宽度/高度相对于窗口大小，”vw”=”view width”, “vh”=”view height”; 以上我们称为视窗单位允许我们更接近浏览器
转载
精选
2016-10-27 20:06:52
1408阅读
content可用于在链接后的括号内加上网址： <!DOCTYPE html><html><head><style>a:after {content: " (" attr(href) ")";}</style
原创
2024-08-06 23:05:40
44阅读
...
转载
2021-08-20 17:00:00
191阅读
2评论
