标签：<标签名>内容</标签名>
<标签名 属性名=" " 属性名=" "/>
规范要求：标签名小写，属性名小写，属性值加引号，（属性和属性，标签名之间有空格）
必须有闭合标签，正确嵌套，子标签注意缩进
注意 ：所有符号必须是英文环境下的符号
相对路径：
相对于当前html页面所在地址
例如：
c:/demo/first.html中<img src="pic.jpg"/>
则图片必须放在c:/demo/pic.jpg
超链接：
<a href="跳转地址" target="跳转打开位置" name="设置锚点位置">超链接显示内容</a>
href属性：点击跳转作用，若无不能点击
target：空白页打开:_blank或当前页面打开 :_self 默认当前页面打开
name：设置锚点位置名字
超链接功能：
A超链接跳转：<a href="跳转地址">点击文字</a>
B锚点设置和使用：
1位置设定： <a name="位置名"></a>
2点击跳转锚点位置：
<a href="跳转页面地址#锚名字">点击文字</a>
列表
无序列表
<ul>
<li>列表项</li>
<li>列表项</li>
</ul>
适合:1列或1行数据， 导航，新闻列表，菜单，列表标题
有序列表
<ol>
<li>列表项</li>
<li>列表项</li>
</ol>
定义列表
<dl>
<dt>定义标题</dt>
<dd>定义描述</dd>
</dl>
适合：图文介绍，名词解释
----------------------------------------
表格
表格标签<table border="边框粗度" align="水平对齐方式" width="表格宽度" height="表格高度">
行标签<tr>
单元格标签<td align="水平对齐方式" width="单元格宽度" height="单元格高度" colspan="跨列数" rowspan="跨行数">
优点：整齐，布局方便
缺点：层次深，所有数据加载完毕才能展示
适合：结构整齐，展示较少的数据
框架：
优点：组合方便，复用页面
缺点：结构复杂，不易于搜索引擎抓取
适合：网站后台，使用较少
iframe（行级标签）
优点：灵活，简单，复用页面，在有内容的界面附加代码
缺点：不易于搜索引擎抓取
适合：公共页面，头，尾，分类导航等
<iframe src="复用页面地址" name="框架名" width="框的宽度" height="框的高度"
frameborder="边框粗细" scrolling="是否有滚动条"></iframe>
--------------------------------------------------
超链接跳转框架页的方法：（超链接在框内）
1 对应的框架页面添加name属性值（给框架起名）
2 在超链接上添加target=“parent”
可以实现：点击超链接在对应的框架页中显示跳转结果
超链接跳转框架页的方法：（超链接在框外）
1 对应的框架页面添加name属性值（给框架起名）
2 在超链接上添加target=“框架名”
可以实现：点击超链接在对应的框架页中显示跳转结果
CSS
内部样式：
<head>
<style type="text/css">
标签选择器： 选择器：p{
字体大小：font-size：12px;
颜色： color:red;(可以写英语 也可以写RGB颜色代码)
背景颜色：background:red;
}
类选择器： .class{
字体大小：font-size：12px;
颜色： color:red;
}
ID选择器： #id{
字体大小：font-size：12px;
颜色： color:red;
}
</style>
</head>
<body>
<p></p>
<p class="class"></p>
<p id="id"></p>
</body>
优先级：id选择器>类选择器>标签选择器
行内样式：<标签名 style="color=red;font-size=12px">
内部样式表：只能用于本页面
外部样式表：1.在页面外文件夹内新建一个CSS文件 把内部样式style标签里面的选择器写到CSS文件里
2.在本页head标签里加上
<link rel="stylesheet" type="text/css" href="CSS文件名">
或者（一般不用）<head>
<style>
@import url("CSS文件名");
</style>
</head>
优先级：行内样式>内部样式表>外部样式表（但是遵循就近原则）
后代选择器：
父选择器 子选择器{
样式名：样式值；
}
如：h3 strong{} 是定位到h3标签下的strong标签
1.两个标签之间用空格隔开
2.上面的h3 可以换成.class和#id
3.样式是子标签的样式，而且该选择器所选中的标签必须是父选择器选中的标签之内
交集选择器：
选择器1选择器2{
样式名：样式值;
}
如：h3.class{} 是定位到有class属性的h3标签
1.中间不能有空格
2.上面的.class可以换成#id
3.标签名是标签选择器定义的标签名同时添加class=类选择器定义的类名才能拥有该样式
并集选择器：
选择器1，选择器2{
样式名：样式值;
}
如：h3，.class,#id 是定位到有所有h3标签和class和id
1.中间用逗号隔开
2.选择器1和选择器2二者都享有该样式
注意：选择器标签属性小写，属性后面加“:”(不加等号！不加等号！不加等号！)，“；”分割两个属性
不能用中文符号
类名id名用英语，不能数字开头，取名有意义
外部样式表.css文件中不用写style标签。
p标签不能放在div标签里面
超链接自带颜色属性 h1自带字体属性会阻断继承性
注释：html里面<!-- -->
CSS 里面/* */
<span></span>标签
字体样式
字体类型：font-family:Times,"Times New Roman", "楷体" 先英文后中文 中间加逗号 英文有空格和中文加引号
字体大小：font-size:12px;
字体风格：font-style:italic; normal默认标准 italic oblique
字体粗细：font-weight:bold; narmal默认标准 bold粗体 bolder更粗 lighter更细 100-900越大越粗
在一个声明中设置所有属性：font:风格 粗细 大小 类型(按顺序)
文本属性
文本颜色：color:颜色英文或代码;
对齐方式：left reght center justify（两边对齐）;
文本缩进：text-indent:行高px（像素）/em(字节);
行高：line-height: ;
装饰：none underline下划线 overline上划线 line-through删除线 blink闪烁;
鼠标形状
default默认光标
pointer手
wait沙漏
help箭头问号
text I
crossshair 十
网页背景：
background-color:颜色；
background-image：url(图片路径);
background-repeat:repeat no-repeat repeat-x repeat-y;
background-position:x y; x方向关键词left center right y方向关键词top center bottom
列表样式
list-style-type:none无标记符号 disc实心圆 circle空心圆 square实心正方形 decimal数字;
list-style-image：url(图片路径);
list-style-position：inside/outside;
盒子模型
边框
四个分着设：
border-top:上边框；
border-right:右边框；
border-bottom:下边框；
border-left:左边框；
border:上边框 右边框 下边框 左边框；（中间空格隔开）
border:上边框 左右边框 下边框； （中间空格隔开）
border:上下边框 右右边框；（中间空格隔开）
border:边框；
边框颜色
border-color:颜色；
边框粗细
border-width:thin medium thick;
边框样式
border-style:none hidden dotted点虚线 dashed杠虚线 solid实线 double双线
每条边都可以同时设border的各个属性
外边距（四个方向）
margin:5px;
margin:0px auto;左右对齐自动 auto是居于父窗体中间
内边距（四个方向）
padding:5px;
盒子模型总尺寸=border-width+padding+margin+内容宽度
所以内边框 外边框 边框宽度 内容宽度 都会影响整体宽度
块级元素 h1-h6 p div 列表
行级元素 span a img strong
行级元素可以包含在块级元素中间 反之不行
display
diaplay：none；:超链接隐藏之后 会被后面的内容占位置
diaplay:block; ：会让行级标签变成块级标签
display：inline；：会让块级标签变成行级元素
行级元素没法设宽高 块级元素可以
body有默认填充
---------------------------------------------10.21盒子 背景
width=100%:父类百分之百
top向上是负的 left向左是负的...
绝对定位用一次就得都用
Hover等并不一定都用在超链接上
---------------------------------------------10.22
浮动
float:left right none;
清除浮动
clear:left right both none;
溢出处理
overflow：visible呈现在盒子外 hidden被修剪不可见 scroll被修剪滚动条 auto如果被修剪滚动条；
定位
position：static默认无定位 relative相对定位 absolute据对定位 fixed固定定位不常用；
相对定位（相对于原来的位置）
position：relativet:top left right bottom;
left:...;
...
据对定位（相对于一个已定位的祖先元素 若没有 以窗口为基准）
position：relativet:top left right bottom;
left:...;
...
z-index:调整元素定位重叠时的上下位置
z-index:整数默认0 大在上；
透明度
opacity：x; 0-1越小越透
filter：alpha(opacity=x);1-100
3019
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
