51dev.com IT技术开发者社区

51dev.com 技术开发者社区

css

CSS预处理器—Sass、LESS和Stylus

CSS预处理器—Sass、LESS和Stylus

http://www.w3cplus.com/css/css-preprocessor-sass-vs-less-stylus-2.html一、什么是CSS预处器CSS预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为CSS增加了一些编程的特性,将CSS作为目标生成文件,然后开发者就只要使用这种语言进行...

面向属性的CSS命名

面向属性的CSS命名

自从开始做前端开发以来,我发现在开发页面的时候,总是有一个问题十分影响自己的开发效率,这个问题就是css的命名,主要是指css类选择器的命名。这个问题主要体现在:第一,有的内容你压根想不出用什么名字来给它命名,因为一般命名总是考虑语义化,好让其他人看到这个css类的名字就知道它是作用于哪一个内容的,但是由于网页内容的复...

CSS精灵

CSS精灵

方法一:方法二:watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center">方法二能够降低http请求。!!css精灵的核心思想是将多张图片合...

Jquery+css实现图片无缝滚动轮播

Jquery+css实现图片无缝滚动轮播

原文地址:http://www.cnblogs.com/shaojiang/p/5295826.html最终实现界面如下:页面加载时,自动轮播,轮播鼠标悬停在整个banner容器的时候,两边会显示向左,向右按钮,鼠标悬停在中下方索引圆圈的上面,自动跳转到相应的图片。 banner容器里面包含了图片列表img,...

CSS3伪类与伪元素的区别及注意事项

CSS3伪类与伪元素的区别及注意事项

CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的伪类:用于向某些选择器添加特殊的效果伪元素:用于将特殊的效果添加到某些选择器讲道理,可能我语文不好,我觉得这两句话是等价的:-) 根本不能看出有什么区别&...

css设置字体单行,多行超出省略号显示

css设置字体单行,多行超出省略号显示

 单行:  overflow: hidden;  text-overflow:ellipsis;  white-space: nowrap; 多行    display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-l...

利用css  画各种三角形

利用css 画各种三角形

 #triangle-up{    width:0;    height:0;    border-left:50pxsolidtransparent;   &...

css设置滚动条样式

css设置滚动条样式

滚动条几个属性,主要有下面7个属性::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的::-webkit-scrollbar-button 滚动条两端的按钮::-webkit-scrollbar-track  外层轨道::-webkit-scrollbar-t...

原生JS+ CSS3创建loading加载动画;

原生JS+ CSS3创建loading加载动画;

效果图: js创建loadingshow=function(){//loadingdom元素varDiv=document.createElement("div");Div.setAttribute("class","ui-loading");varchidDiv=document.createElement...

CSS完美兼容IE6/IE7/IE8/IE9/IE10的通用方法

CSS完美兼容IE6/IE7/IE8/IE9/IE10的通用方法

300px!important;width/**/:340px;margin:010px010px},关于这个/**/是什么我也不太明白,只知道IE5和firefox都支持但IE6不支持,如果有人理解的话,请告诉我一声,谢了!:)3、ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所...

使用scss覆盖vant默认样式

使用scss覆盖vant默认样式

//vant覆盖默认样式的写法<style lang="scss" scoped> ::v-deep .van-popup {    background: transparent;  &...

文件图标css样式

文件图标css样式

.list-list.ico-bookfolder{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5cc...

解决 iOS webkit 使用CSS动画时闪烁的问题

解决 iOS webkit 使用CSS动画时闪烁的问题

-webkit-backface-visibility:hidden; ...

javascript获取CSS3浏览器前缀

javascript获取CSS3浏览器前缀

varprefix=(function(){varstyles=window.getComputedStyle(document.documentElement,''),pre=(Array.prototype.slice.call(styles).join('').match(/-(moz|webkit|ms)-/)...

深入理解脚本化CSS系列第六篇——脚本化伪元素的6种方法

深入理解脚本化CSS系列第六篇——脚本化伪元素的6种方法

  我们可以通过计算样式来读取伪元素的样式信息,但是却无法使用javascript来直接操作伪元素,本文以一个需求解决为例,详细介绍脚本化伪元素的6种方法需求说明  【1】为id=box的div元素添加content="前缀"的:before伪元素  【2】为已经添加:before伪元素的div元素删除伪元素  &nb...