CSS
梦想退休的许小姐
这个作者很懒,什么都没留下…
展开
-
CSS · border
实现border-width:0.5px;需求:把列表分割线改成0.5px直接写成border:0.5px solid #cccccc;是不符合规范的写法,依旧会显示1px。同时存在Android和IOS手机上的兼容问题。解决方法:利用CSS3的transform特性,放缩边框宽度来实现这一效果。HTML<ul class="list"> <li class="item">边框宽度0.5px</li> <li class="item"&g原创 2021-10-20 11:18:08 · 130 阅读 · 0 评论 -
CSS · 字体小于12px
Webkit 内核可以使用-webkit-text-size-adjust 的私有CSS属性来解决,通过它即可实现字体大小不随终端设备或浏览器影响。样式定义如下:#chrome10px{ -webkit-text-size-adjust:none; font-size:10px; }但是,在chrome更新到27版本之后就不可以用了。因为ie是支持12号及以下字号的。font-size : 12px;-webkit-transform : scale(0.84,0.84) ;*font-siz原创 2021-08-30 14:18:12 · 165 阅读 · 0 评论 -
CSS @media媒体查询
@media screen and (max-width: 300px) {body {background-color:lightblue;}}iphone4 */@media screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2){}/* iphone5 */@media screen and (device-width: 320px) and (原创 2021-07-26 17:13:27 · 353 阅读 · 0 评论 -
移动端一倍图,二倍图尺寸
1 rem = html font-size = 50px在reset.css文件中假如一个二倍图的div高度是86px那么对应的我们应该填43px移动端一般用rem表示宽高所以这里我们应该填写0.86rem如果一个一倍图的高度是23px那么我们应该填写0.46rem同理3倍图————————————————版权声明:本文为CSDN博主「VVVGG」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。原文链接:https://blog.csdn.net/V原创 2021-07-26 16:39:46 · 1194 阅读 · 0 评论 -
CSS · 单行、多行文本溢出显示省略号
单行文本的溢出overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行文本溢出display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;适用范围: 因使用了WebKit的CSS扩展属性,该方法适用于WebKit浏览器及移动端;注:-webkit-line-clamp用来限制在一个块元素显示的文本原创 2021-06-30 16:57:11 · 328 阅读 · 0 评论