标签:css

12条鲜有人知的css事实(续)-Web前端(W3Cways.com) - Web前端学习之路
使用技巧

12条鲜有人知的css事实(续)

admin阅读(4407)赞(0)

此文为译文,作者在这篇文章中提到了12条我们前端人员在日常工作中不是特别熟悉而又确实可以使用或者浏览器是可以很好支持的CSS技巧,熟知这些点,对我们深入研究CSS有很好的帮助。 ————...

CSS滚动界限点scroll-snap-points-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

CSS滚动界限点scroll-snap-points

admin阅读(6154)赞(0)

CSS最近推出了CSS滚动界限点的功能,给用户提供了流体和精确的滚动体验触控和输入设备。 有很多Jquery滚动界限插件可供选择(如:scrollify,jquery.panelsnap,scrollstop.js)现在我们可以用CSS来添...

CSS设置checkbox复选框-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

CSS设置checkbox复选框

admin阅读(6084)赞(1)

之前发过一篇《jquery模拟checkbox(复选框)》 随着现代浏览器的流行,纯CSS设置checkbox也变的很是实用,下面会讲到5种与众不同的checkbox复选框(Demo在文章最下方)。 首先,需要添加一段CSS隐藏所有的Che...

用CSS创建跨浏览器的range input-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

用CSS创建跨浏览器的range input

admin阅读(6021)赞(0)

在这篇教程中,我们用基本的range input作为例子: 然后把它变成: 为了简化生成跨浏览器兼容的样式的过程,我们引进LESS。当然也有CSS版本。 添加基础CSS样式 我们需要给range input添加几个样式来覆盖所有浏览器的默认...

Cube - 来自阿里妈妈的CSS(样式)解决方案-Web前端(W3Cways.com) - Web前端学习之路
前端框架

Cube – 来自阿里妈妈的CSS(样式)解决方案

admin阅读(23496)赞(0)

Cube是由阿里妈妈团队创建。取自电影 《Cube》。电影里的 Cube 是个构造错综复杂的立方体,取这个名字,则是希望此项目能回归立方体的本意,和电影的愿景, 即项目应简单,一横一竖,自成一体。 官网地址:http://thx.githu...

CSS之RGBA颜色指南-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

CSS之RGBA颜色指南

admin阅读(29943)赞(0)

RGBA是一种可以设置颜色值和透明度的CSS颜色 下面是用rgba() 设置50%透明度的白色. p { color: rgba(255, 255, 255, 0.5); } RGBA是RGB色彩模型的一个扩展。这个缩写词代表红绿蓝三原色的...

HTML/CSS

CSS使文字部分变色

admin阅读(10811)赞(0)

思路 思路很简单,就是一个字写两遍,一个字只显示部分,不过不能真的把一个字写两遍。这里就需要用到CSS伪元素:before和:after,记住这个“伪元素”的“伪”字,表明它本来是不存在的。我们的方法就是在伪元素里放置相同的字符,只显示半个...

未知高度的图片在div设置垂直居中-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

未知高度的图片在div设置垂直居中

admin阅读(5591)赞(0)

图片的宽度和高度是未知的,没有固定的尺寸,在这个前提下要使图片在一个固定了宽度和高度的容器中垂直居中。最近的在做的项目就有这个需求,所以先把一些常用的方法都收集整理了一下。 下图是理想中的效果图,外部容器的宽度和高度固定,中间的图片宽度和高...

CSS设置垂直居中-Web前端(W3Cways.com) - Web前端学习之路
HTML/CSS

CSS设置垂直居中

admin阅读(6391)赞(0)

解决思路是得到父元素的height,减去子元素的height,再除以2,得到的结果作为像素值内联Top属性。其实就是父元素的50%的高度再减去子元素50%的高度。 下图解释: 上图中红色的“210px”,是我们需要在“top”属性设置的值。...