css之乱总结
1.显示与隐藏
visibility:visible;
visibility:hidden;
>>>visibility会保留对象的位置
display:inline;
display:block;
display:none;
>>>display:none不保留对象的位置
2.内联与块
内联:inline,如:<a>, <font>, <span>. 元素共存于一行中。
块:block,如:<div>, <table>, <li>。 前后加换行。
>>>由diaplay可以改变性质
3.边框
3.1要设置一种border-style: solid;才能显示。值:none, solid, outset等十种。
3.2边框合并:即紧邻两边框合并成一条。
border-collapse: collapse; 值:collapse | separate | inherit
3.3透明边框
border-color: transparent;
>>>透明,但保留占位。
4.链接
a:link,a:visited,a:hover,a:active
>>>其实使用的是伪类.在 CSS 定义中,a:hover必须位于 a:link 和 a:visited 之后,这样才能生效.在 a:active必须位于 a:hover 之后,这样才能生效!
5.伪类
:link, :visited, :focus
>>>相当于事件,即事件发生的对象上体现这个属性设置
6.背景
6.1 背景重复
background-repeat: no-repeat; 值:repeat-x, repeat-y, repeat;
6.2 水印效果
background-attachment: fixed; 值:fixed, scroll;
7. 如何使用外部css
<link href="../css/topic.css" rel="stylesheet" type="text/css">
>>>将.css文件路径替换
8. 文本
8.1 对齐
text-align: center; 值:justify, left, right, center;
8.2 修饰
text-decoration: underline; 值:none, underline, overline, line-through, blink
>>>blink是闪烁,有动画效果,可用于提示。
8.3 缩进
text-indent: 20px;
>>>可以是负值.用于定义块级元素中第一个内容行的缩进,产生一种“悬挂缩进”的效果。
8.4 大小写
text-transform: uppercase; 值:none, uppercase, lowercase, capitalize;
>>>capitalize每个单词首字母大写
8.5 空白处理(格式)
white-space: normal; 值:normal, pre, nowrap;
>>>nowrap:文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
8.6 方向
direction: rtl; 值:rtl, ltr;
>>>左右关系
9. 字体
9.1 名字列表
font-family: "times, sans-serif"; 逗号隔开各字体名,引号括起
9.2 粗细
font-weight: normal; 值:bold, bolder, lighter, 100~900
10. 表格
10.1 布局
table-layout : fixed; 值: fixed, automatic;
>>>fixed:只要有第行行内容,整个表格即可显示。
10.2 显示空单元格
empty-cells: show; 值:hide, show;
>>>仅用于 "separated borders" 模型
10.3 边框间空白
border-spacing: 20px 50px;
>>>列,行间距
10.4 标题位置
caption-side: left; 值:top, right, bottom, left
|