![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css
文章平均质量分 60
物以稀为贵yeah
这个作者很懒,什么都没留下…
展开
-
css3中rem详解
rem是css3新增的一个属性,它是一个相对单位,直观上可以说:是相对于html元素字体大小的单位。兼容性:大多数浏览器都支持,除了IE8以下不支持,但rem一般多用于移动端页面。优点:在计算子元素有关的尺寸时,只要根据html元素字体大小计算就好。不再像使用em时,得来回的找父元素字体大小频繁的计算。1、针对设计稿计算rem 所有浏览器都一致默认保持着 16px 的默认字号,rem与px关系为原创 2017-06-15 16:44:55 · 1664 阅读 · 0 评论 -
font-size = 0 的作用
问题的根源是 inline(a标签默认是display:inline) 和 inline-block (.list 设置的是 display:inline-block) 是内联布局,既然是内联那么就会受空白区域的影响。 这是像素级还原设计稿很有用的设置,因为元素节点有文本节点,在缩进代码时会占据宽度,这么说不好理解,演示如下:HTML<div class="box"> <div>1<原创 2017-06-21 15:08:32 · 3074 阅读 · 0 评论 -
兼容ie8以下 rgba()用法
可以使用 IE 的 filter 来解决rgba的兼容性。CSS:background: rgba(255, 255, 255, .1);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff);第二句话的意思就是当上一行的透明度不起作用的时候执行。这句话的意思原创 2017-07-03 15:22:51 · 1098 阅读 · 0 评论 -
1px在高清屏幕上的问题
一直以来我们实现边框的方法都是设置 border: 1px solid #ccc ,但是在 retina 屏上因为设备像素比的不同,边框在移动设备上的表现也不相同: 1px 可能会被渲染成 1.5px, 2px, 2.5px, 3px....,在用户体验上略差,所以现在要解决的问题就是在 retina 屏幕实现 1px 边框。 有以下几种方式:1、transform: scale(0.原创 2017-07-03 15:29:52 · 671 阅读 · 0 评论 -
html字符编码
形状 字符编码 形状 字符编码 ▲ 25B2 ❤ 2764 ► 25BA ✈ 2708 ▼ 25BC ★ 2605 ◄ 25C4 ✦ 2726 ☀ 2600 ◆ 25C6 ◈ 25C8 ▣ 25A3 « 00AB » 00BB ‹ 008B › 009Bhttp转载 2017-07-03 17:03:00 · 753 阅读 · 0 评论 -
页面内容不足一屏时显示在这一屏的最下方
有时候,当页面内容较短,撑不开浏览器高度,但是又希望footer能在窗口最低端。 思路一:将footer的父级元素的最小高度设置为100%,并相对定位;父级元素内要预留footer的高度;并将footer的绝对定位(absolute),置底(bottom:0);HTML<div id="container"> <div id="header">header</div> <原创 2017-06-30 10:59:04 · 1863 阅读 · 0 评论 -
字体号数与像素对应关系
英文字体的1磅,相当于1/72 英寸,约等于1/2.8mm。 12PT的字打印出来约为4.2mm。网页中12px的字才相当于12像素。 虽然 四号=(14/72)*96=18.6px 更接近 19px,但是因为 18px 是点阵,所以系统还是优先显示点阵字号的。 换句话说:四号=18px 中文字号VS英文字号(磅)VS像素值的对应关系: 字号 磅数 像素 八号 5转载 2017-09-18 16:51:40 · 8465 阅读 · 0 评论 -
CSS中line-height带单位与不带单位的区别
line-height用来设置元素的行高。 该属性会影响行框的布局。在应用到一个块级元素时,它定义了该元素中基线之间的最小距离而不是最大距离。css里的line-height默认单位是em,相对于父级设置的高度。若是自适应建议是用em单位,比如:line-height: 1em,代表行高是16px;若要精确距离建议用px单位,比如:line-height: 1px,代表行高1px;不带单位原创 2017-10-09 14:08:46 · 3698 阅读 · 0 评论