CSS标签特性——简单介绍

下面给大家简单说一下我们日常所用css中一些标签特性。

  1、如果大家仔细观察的话，在我们使用的HTML里面，不同的标签会有不同的显示方式，这是因为css对标签进行了默认的初始化。但有时我们并不需要（对于初学者对样式要求不高请忽略），所以我们需要对其样式进行初始化：

<span style="font-size:18px;">body,dl,dd,p,h1,h2,h3,h4,h5,h6{margin:0;font-size:12px;}//清除所有外边距，固定字体大小
ol,ul{margin:0;padding:0;list-style:none;}//有序和无序标签外边距，内边距清零，前面显示数字和圆点清除
a{text-decoration:none;}//a标签下划线取消
img{border:none;}//图片默认的外框取消（在IE6下有特殊外框）
</span>

简称css reset 原则：但凡是浏览默认的样式，都不要使用。
2、块元素和内联元素（内嵌、行内）

块元素：div、p、ol、ul、dl、h1~、hr。。。

特征
1、默认独占一行 （可以认为上下都有换行符，同时存在只有一个）
2、没有宽度时，默认撑满一排（即使设置宽度，后面也会有换行符）
3、支持所有css命令

内联元素：a、span、br、input、textarea。。。

特征
1、同排可以继续跟同类的标签
2、内容撑开宽度（宽度随着内容更改）
3、不支持宽高（即使设置也不会有效果）
4、不支持上下的margin和padding（左右效果存在，上下的效果margin无，padding可能会出现错误切不能排开其他元素）
5、代码换行被解析（换行符被认为一个空格间距隔开，无换行符则会直接贴在一起）

  二者可以相互转换

display:block;//内联转换为块

display：inline;//块转为内联

还有一种特殊的：inline- block；例如img标签

特性：
1、块在一行显示；
2、行内属性标签支持宽高；
3、没有宽度的时候内容撑开宽度
问题：
1、代码换行被解析；
2、ie6 ie7 不支持块属性标签的inline-block;

前端书写的一些规范：

1、所有书写均在英文半角状态下的小写；
2、id，class必须以字母开头；
3、所有标签必须闭合；
4、html标签用tab键缩进；
5、属性值必须带引号；
6、<!-- html注释 -->
7、/* css注释 */
8、ul,li/ol,li/dl,dt,dd拥有父子级关系的标签；
9、p,dt,h标签  里面不能嵌套块属性标签；
10、a标签不能嵌套a；
11、内联元素不能嵌套块；