CSS
关注
分享
扫一扫
zh_rey
这个作者很懒，什么都没留下…
展开
-
CSS实现文字或图片等元素垂直、水平、绝对定位居中技术
Ⅰ.绝对定位居中(Absolute Centering)技术我们经常用margin:0 auto来实现水平居中，而一直认为margin:auto不能实现垂直居中……实际上，实现垂直居中仅需要声明元素高度和下面的CSS:[css] view plain copy print?.Absolute-Center { margin: auto; position: absolute;转载 2017-04-19 13:26:37 · 3300 阅读 · 0 评论 -
2017年度最佳 JavaScript 和 CSS 开源库推荐！
Tutorialzine 每个月都会公布一次当月新增的 JS 和 CSS 库。2018 新年之际，该网站整理出了 2017 年最受用户欢迎和喜爱的一些 JS 和 CSS 库，供大家学习和参考。JavaScript 本地存储库 localForage传送门：https://www.oschina.net/p/localforagelocalForage 是一个 JavaScript 库，提升了应用程...转载 2018-02-24 14:24:22 · 5895 阅读 · 0 评论 -
CSS设置滚动条样式（兼容IE）
废话不多说，直接上demo，最下面有详细注释。1、这是在webkit浏览器下显示的样式。 （个人比较喜欢简约点的）2、在IE浏览器下显示的样式（为了区分所以样式写的不一样，我没找到IE下设置滚动条宽高的方法）下面是代码： Lorem ipsum dolor sit amet, consectet原创 2017-05-18 16:33:47 · 85646 阅读 · 27 评论 -
解决因出现滚动条导致页面抖动
现在大多数页面都是采用主体内容水平居中布局<body> <div></div></body>div{ width:1200px; margin:0 auto;}但是，这种布局存在一个问题。现在的浏览器滚动条默认是overflow:auto类型的，也就是说如果内容高度不足一屏，没有滚动条；如果超出才会出现滚动条。于是，问题来了：信息流页...原创 2017-08-24 16:30:18 · 18209 阅读 · 13 评论 -
仅针对IE8的css hack
利用:root选择器排除IE8进行hack原创 2017-04-26 10:10:23 · 1496 阅读 · 0 评论 -
div或img图片高度随宽度自适应
该方法主要用来做网站自适应的，同时可以实现撑起内容高度，避免图片加载后导致的页面滚动。一、可以使用js判断图片的宽度得到具体数值之后，再来利用js设置图片的高度（这里就不具体为大家细说了）。利用js来实现有一个缺点就是只能在页面刷新的时候才能调整图片的高度，不能随着浏览器的窗口大小变化来实现自适应。二、我这次主要是用css来实现图片高度的自适应问题。下面是所需要的代码（这种方法是可以在图片上方垂直...原创 2017-04-08 11:39:39 · 136739 阅读 · 8 评论 -
web开发中常用css兼容代码（包括移动端）
持续更新中。。。1、select去除下拉按钮 select::-ms-expand { display: none; }select{ -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none;} -webkit-appearance: none; -mo...原创 2017-10-28 11:50:37 · 931 阅读 · 0 评论 -
CSS3 Flexbox布局详解
Flexbox，一种CSS3的布局模式，也叫做弹性盒子模型，用来为盒装模型提供最大的灵活性。首先举一个栗子，之前我们是这样实现一个div盒子水平垂直居中的。在知道对象高宽的情况下，对居中元素绝对百分比定位，然后通过margin偏移的方式来实现。 .container{ width: 600px; height: 400px; bord转载 2017-05-23 14:08:43 · 944 阅读 · 0 评论 -
css单行或多行文本溢出显示省略号
一、单行文本溢出省略二、多行文本溢出省略 1、适用于WebKit浏览器及移动端； 2、兼容各版本浏览器原创 2017-04-08 10:17:50 · 4927 阅读 · 0 评论 -
css绘制三角形
/*向上*/.triangle_border_up{ width:0; height:0; border-width:0 30px 30px; border-style:solid; border-color:transparent transparent #333;/*透明 透明 灰*/}/*向下*/.triangle_border_down{原创 2017-08-30 14:52:29 · 354 阅读 · 0 评论 -
通过css3的filter滤镜改变png图片的颜色
本方法是通过CSS3滤镜 filter 中的 drop-shadow 将png图片的非透明部分生成任意颜色的投影，然后将原始图片隐藏起来，从而达到改变图片颜色的目的先看效果图接下来是代码<p><strong>原始图标</strong></p><i class="icon icon-del"></i><p>...原创 2019-07-04 14:35:58 · 4549 阅读 · 0 评论