10分钟梳理css知识点

css 选择器

h1 {color:red; font-size:14px;}

元素选择器

h1,h2,h3,h4,h5,h6 {color: green;}

选择器分组

li strong {font-style: italic;font-weight: normal;}

//派生选择器

#idStr {color:red;}

//id选择器

.className {text-align: center}

//类选择器

[title=W3School] { border:5px solid blue; }

// 属性选择器

css 样式创建

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

//外部样式

内部样式

<style type="text/css">
hr {color: sienna;}
p {margin-left: 20px;}
body {background-image: url("images/back40.gif");}
</style>

内联样式

<p style="color: sienna; margin-left: 20px">
This is a paragraph
</p>

结合使用时，就近原则！！

css 样式

background-color 背景色

background-image 背景图片

text-indent 首行缩进

word-spacing

... 太多了平时积累吧

盒模型

懒的说，理解了就OK

border-style 很有趣

css 定位

Positioning

static

relative 相对定位

absolute 相对于包含元素绝对定位（父级元素）

fixed 相对于window绝对定位

float 浮动

left 元素向左浮动。

right 元素向右浮动。

none 默认值。元素不浮动，并会显示在其在文本中出现的位置。

inherit 规定应该从父元素继承 float 属性的值。

display

none 边框无

block 块框

inline 行内框

...