css一些我所不熟练的属性

<hr /> 表示一条横线

css的三种创建方式:

外部样式表

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

内部样式表

<head>
<style type="text/css">
  body {background-image: url("images/back40.gif");}
</style>
</head>

内联样式

<p style="color: sienna; margin-left: 20px">
This is a paragraph
</p>
当混合搭配时先是就近原则,当就近中没有时再继承将远处更具体的样式表。
background-attachment 背景图像是否固定或者随着页面的其余部分滚动。值:scroll(默认), fixed。

text-indent: 首行代码缩进

text-align: center; 文本水平对齐方式

text-transform: uppercase;字母大小写问题 capitalize 只对每个单词的首字母大写。

text-decoration: underline;文字装饰问题

word-spacing 属性可以改变字(单词)之间的标准间隔。

letter-spacing 属性与 word-spacing 的区别在于,字母间隔修改的是字符或字母之间的间隔。
white-space 属性会影响到用户代理对源文档中的空格、换行和 tab 字符的处理。 下面的表格总结了 white-space 属性的行为:
空白符换行符自动换行
pre-line合并保留允许
normal合并忽略允许
nowrap合并忽略不允许
pre保留保留不允许
pre-wrap保留保留允许

链接的四种状态:

  • a:link - 普通的、未被访问的链接
  • a:visited - 用户已访问的链接
  • a:hover - 鼠标指针位于链接的上方
  • a:active - 链接被点击的时刻
border-collapse:collapse/separate(默认)


outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。


  • outline-color 边框的颜色
  • outline-style 风格
  • outline-width 宽度

外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

overflow可能的值:

描述
visible默认值。内容不会被修剪,会呈现在元素框之外。
hidden内容会被修剪,并且其余内容是不可见的。
scroll内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit规定应该从父元素继承 overflow 属性的值。

clip 属性剪裁绝对定位元素。

可能的值

描述
shape设置元素的形状。唯一合法的形状值是:rect (top, right, bottom, left)
auto默认值。不应用任何剪裁。
inherit规定应该从父元素继承 clip 属性的值。

z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。

注释:元素可拥有负的 z-index 属性值。

注释:Z-index 仅能在定位元素上奏效(例如 position:absolute;)!

伪元素

属性描述CSS
:first-letter向文本的第一个字母添加特殊样式。1
:first-line向文本的首行添加特殊样式。1
:before在元素之前添加内容。2
:after在元素之后添加内容。2
在标题后插入一张图片
h1:after { content:url(logo.gif); }