acongshijia的专栏

在ie下模拟css3中的box-shadow（阴影）可以使用ie的Shadow（阴影）滤镜 基本语法：filter: progid:DXImageTransform.Microsoft.Shadow(color=’颜色值’, Direction=阴影角度（数值）, Strength=阴影半径（数值）); 注意：该滤镜必须配合background属性一起使用，否则该滤镜失效。 .b

@charset "utf-8"; html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,ifra me{margin:0;padding:0;} body,input,button,select,textarea,tabl

多行文本未知高度垂直居中-by一丝 多行文本未知高度垂直居中-by 一丝多行文本未知高度垂直居中-by 一丝多行文本未知高度垂直居中-by 一丝 *{margin:0;padding:0;} .box{ height:200px; width:300px; background:pink; margin:30px auto; } .box

css: /*打钩 */ .u-icon-radioSB { width: 22px; height: 22px; border-radius: 100%; position: relative; background: #4288E3;

.u-icon-arr { position: absolute; top: 50%; right: 15px; width: 12px; height: 12px; border-style: solid; bor

[class^="u-icon"] { display: inline-block; color: #fff; vertical-align: middle; } /*手机上的切换标签*/ .u-icon-toggle {

线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向径向渐变（Radial Gradients）- 由它们的中心定义 从上到下的线性渐变： #grad { background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */ background: -o-linear-gradi

.test { border: 20px dotted red; height: 200px; width: 200px; margin: 16px; background: url("/Content/014.png"); background-origin: padding-box;

html {font-size: 62.5%;} //10/16 = 62.5%body {font-size: 1.2rem;} //1.4*10px = 12pxh1 { font-size: 2.4rem;} //2.4*10px = 24pxrem与em都是相对的计算单位， 计算上类似不过是以统一的根元素设定基准值，默认原基准值为1em=16px； 实际应用中  html {f

三角形翻转的效果，大家想必见过，这里就把相关代码贴下，大家可以应用哦，当然翻转效果暂时不支持IE 6 7 8， 1、纯CSS做个三角 .rightdirection { width:0;height:0; line-height:0; border-width:20px; border-style:solid; border-color:transparent transp

CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。 为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器的内核， 主流内容主要有Mozilla（熟悉的有Firefox，Flock等浏览器）、WebKit（熟悉的有Safari、Chrome等浏览器）、Opera（Opera浏览器）、Tride

W3C标准中对css3的transition这是样描述的： “css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值。” transition主要包含四个属性值： 执行变换的属性：transition-property, 变换延续的时间：transition-dur

在此所说的移动平台前端开发是指针对高端智能手机（如Iphone、Android）做站点适配也就是WebApp，并非是针对普通手机开发Wap 2.0，所以在阅读本篇文章以前，你需要对webkit内核的浏览器有一定的了解，你需要对HTML5和CSS3有一定的了解。如果你已经对此有所了解，那现在就开始往下阅读吧…… 1、首先我们来看看webkit内核中的一些私有的meta标签，这些meta标签在开发w

Media Queries这功能是非常强大的，他可以让你定制不同的分辨率和设备，并在不改变内容的情况下，让你制作的web页面在不同的分辨率和设备下都能显示正常，并且不会因此而丢失样式。 首先来看一个简单的实例： 上面的media语句表示的是：当页页宽度小于或等于600px,调用small.css样式表来渲染你的Web页面。首先来看media的语句中包含的内容：

var deviceWidth = document.documentElement.clientWidth; if(deviceWidth > 640) { deviceWidth = 640; } document.documentElement.style.fontSize = deviceWidth / 6.4 + '