常用css

css 3  动画

.index-product-cont dl:hover b{color:#0094de;transition: color 1s;}

//css 列表绝对居中

<div class="navbar">

        <div>

            <ul>

                <li><a href="/">Home</a></li>.......

            </ul>

        </div>

    </div> 

    <style>        

        .navbar {height:40px;line-height:40px;background:#ccc;}

        .navbar div {position:relative;left:50%;float:left;background:#f60;}

        .navbar ul {position:relative;left:-50%;float:left; background:#00f}

        .navbar li {float:left;}

    </style>

<input type="text" id="wf_detailed_addr" class="input-style" placeholder="默认提示">

//尖角图标

border-color:transparent #343434 transparent transparent;border-style:solid;border-width:6px; 

border-radius 圆角

-moz-user-select: none;   //禁止选中

white-space:nowrap;overflow:hidden;text-overflow:ellipsis;     //文本过长隐藏 打点儿

清除父级浮动.box:after{clear:both; display:block; content:"20";}

固定定位IE6解决方法 #fixed{position:absolute;top:expression(eval(document.body.scrollTop + 50));

截字width:524px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;   

最小高度height:auto!important;height: 420px;min-height:420px;  

最小宽度max-width:100px;_width:expression((document.documentElement.clientWidth||document.body.clientWidth)>100?"100px":"");

<a href="javascript:void(null);" onClick="window.external.addFavorite(document.location.href,document.title)">加入收藏</a>

返回顶部 onclick="window.scrollTo(0,0);"

google等浏览器文本框黄边清除*:focus {outline: none;}

隐藏横向滚动条html {overflow-x: hidden; overflow-y: auto;}

显示纵向滚动条html {overflow-x: hidden; overflow-y:scroll;}

Flash背景透明<param name="wmode" value="transparent" ><embed wmode="transparent"></embed>

背景透明内容不透明{background-color:rgba(000,0,0,0.8); background:#0009; filter:alpha(opacity=80);}

网站变灰

<style>

html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}

</style>

文字横向滚动 速度

<marquee scrollamount="4" direction="up"  onMouseOver="stop()" onMouseOut="start()" ></marquee>

FF 滤镜filter:alpha(opacity=40);Opacity:0.4;

IE6 png图片背景透明

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src="image/grade_ico1.png");_background:none;

文字两段对齐

text-align:justify;

text-justify:distribute-all-lines;

图片文字中心线对齐align="absmiddle" 

<fieldset>

    <legend>标题</legend>

</fieldset>

div滚动

{line-height:25px; padding:0px 10px;height:470px;overflow-y:auto; 

scrollbar-FACE-COLOR: #eee;

scrollbar-highlight-color:#fff;

scrollbar-shadow-color:#eee;

scrollbar-3dlight-color:#eee;

scrollbar-arrow-color:#bbb;

scrollbar-track-color:#eee;

scrollbar-darkshadow-color:#ccc;

}

鼠标移入切换背景颜色

onmouseover="this.style.backgroundColor='#fff6dd'" onmouseout="this.style.backgroundColor=''"

鼠标移入切换背景图片

onmouseover="this.src='../images/float_close2.gif'" onmouseout="this.src='../images/float_close1.gif'"

鼠标移入切换class

onMouseOut="this.className='aaa'" onMouseOver="this.className='bbb'"

document.getElementById('div1').className='ffbug';

鼠标点击关闭DIV

<span onclick="allclose()" ><img src="/images/gb.jpg" /></span>

function allclose()

{

    var 要关闭的div = document.getElementById("要关闭的div");

    要关闭的div.style.display="none";

} 

去掉链接热区边线 a{blr:expression(this.onFocus=this.blur());outline:none;}

去掉input热区边线 hidefocus="true"

文字自动换行word-wrap:break-word;word-break:break-all; 

ie6下内连元素浮动背景上边无及字折行：用padding顶出来上边；用white-space:nowrap; 强行折行。

清楚页面所有同一属性  属性名称="[^"]*"

delay(5000) jq延迟5秒执行

有用  |  无用 取消

猜你喜欢