-
隐藏
overflow:hidden
-
文本对齐方式
水平:text-align:left/center/right 垂直:vertical-align:top/center/middle/bottom
图片在表格中,实现文字垂直居中,只需要在img加上 style=“vertical-align:middle;”
-
文本缩进
text-indent
-
li小黑点
list-style:none;
-
a下划线
text-decoration:none;
-
块水平居中
margin:0 auto;
-
行高
line-height(将行高设置成与高度相同时就能垂直居中)
-
层叠
Z-index 仅能在定位元素上奏效(例如 position:absolute;)
-
背景图居中
background-position:center
-
行内块元素共存
display:inline-block;
-
按钮焦点
<td><input id="btn" type="submit" value=" 登录 "/><script type="text/javascript"> document.getElementById("btn").focus);</script></td>
-
input域输入时的边框
outline:0;
-
表格间的缝隙
table{border-collapse:collapse;}
或<table border=0 cellpadding="0" cellspacing="0" >
-
渐变背景
background:linear-gradient(90deg,#C6CAB8,#FC5);
-
单行文字,超出部分省略号
overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
-
背景轮换
jquery.backstretch.min.js // HOME BACKGROUND SLIDESHOW $(function(){ jQuery(document).ready(function() { $('body').backstretch([ "image/4.jpg", "image/2.png", "image/3.png" ], {duration: 10000, fade: 1300}); }); })
-
边框圆角
border-radius:半径大小(左上 右上 右下 左下)
-
边框阴影
box-shadow:水平偏移 竖直偏移 半径 颜色
-
摆动技术
-webkit-animation:bd 5s ease-in-out;//动画名称 时间 运动速度 永远摆动 @-webkit-keyframes bd{ 0%{-webkit-transform:rotate(30deg);-webkit-transform-origin:center top;} 50%{-webkit-transform:rotate(-30deg);-webkit-transform-origin:center top;} 100%{-webkit-transform:rotate(30deg);-webkit-transform-origin:center top;} }
-
透明度
background:rgba(r,g,b,透明度);
-
可输入
<p contenteditable="true"></p> $(p).text();//获取内容
-
隐藏
display:none;
-
浮动时出现空缺,是因为上一行中出现高度不一致,导致无法进入。只需要设定统一高度height即可