关于HTML+CSS常用标签

html:超文本标记语言

html语言结构：

html：html的根标签

head:网页的头部信息

body：网页的主体部分

html注释：<!--注释的内容-->

常用的标签：

标题标签：h1~h6

段落标签：p

水平线标签：hr

换行标签：br

上标：sup

下标：sub

原样标签：pre

有序列表标签：ol li

无序列表标签：ul li

项目列表标签：dl  dt dd

常用的实体字符：

空格： 

小于号：<

大于号：>

人民币：¥

超链接标签：<a href="">

a 标签常用属性：

href:用于指定链接的资源

target:设置打开资源的目标； _blank在独立的窗口打开页面，_self:在当前窗口打开页面

图片标签：img

img常用的属性：

width:宽度

height：高度

alt:如果图片资源找不到，那么就显示相应的提示文字

表格标签：

 table tr td th caption 

表格常用属性：

border:设置表格的边框

colspan:设置单元格占据指定的列数

rowspan:设置单元格占据指定的行数

表单标签：是用于提交数据给服务器

表单标签的根标签：form

编写css代码的方式：

1、在style标签里面写

2、直接在标签里面写

3、可以引入外部的css文件

css注释：

/**********************/

选择器：

1、标签选择器：

格式：

标签名{

样式1;样式2;....

}

2、类选择器

格式：

.class的属性值{

样式1;样式2;....

}

3、ID选择器

格式：

#id的属性值{

样式1;样式2;....

}

4、交集选择器：就是针对选择器1中的选择器2里面的数据进行样式化

格式：

选择器1 选择器2{

样式1;样式2;....

}

5、并集选择器：对指定的选择器进行统一的样式化

格式：

选择器1,选择器2{

样式1;样式2;....

}

6、通用选择器

*{

样式1;样式2;....

}

伪类选择器：

1.a:link 没有被点击过的状态

 a:visited 已经被访问过的样式

a:hover：鼠标经过的样式

 a:active：

常用的css样式：

 background-color:设置背景颜色

css 布局的方式有三种：1 默认的，就是按文档流的顺序2 浮动布局，就是用float

1    首先将元素分类：

▲  块级元素：<div>、 <p> <ul> <li>，独自占用一行的位置，

▲  内联元素：<span><a>等  可以与其它内联元素在一行上，

 

2        布局的三种方式：

▲  按文档流：即按照html的顺序

▲  按定位（position）：有relative、absolute、static、fixed

▲  按浮动：float

☞relative(相对定位)：元素相对自己的位置偏移某个距离，定位后扔是文档流的一部分

☞absolute(绝对定位)：元素相对父级框定位，元素框从文档流中消失，就和不存在一样，（注意relative和absolute都有的时候，要用概念去理解）

☞fixed：和绝对定位一样，只是父级框为窗体罢了

☞static(无定位)：即默认值，按照文档流的样式

浮动定位（float）：浮动框从文档流中消失，像不存在一样，浮动可以向左向右浮动，浮动浮动，先浮后动，设置浮动的元素先浮到另一层排列，原来的块状属性没有了，在另一层上可以并列以行，其后的各种定位会视其消失了，马上补上。不仅是块级元素可以浮动，内联元素也可以浮动

注意：在ie567中如果你的内容宽度大于div的宽度，会把div撑破，导致其它元素被挤开，解决办法是在外面再套一层div

Clear:清除浮动，用在不想当元素前面的元素应用了浮动，后面的元素不想顶上去的时候，就清除浮动

注意外边距合并的问题。