网页制作的文本标记完整版.docx
《网页制作的文本标记完整版.docx》由会员分享，可在线阅读，更多相关《网页制作的文本标记完整版.docx（13页珍藏版）》请在冰豆网上搜索。
网页制作的文本标记完整版
HTML标记的分类:
1）头部标记：
title,meta,link,style
2）文本标记：
font,b,i,u,strong,
3）段落标记：
p,hn,pre,marquee,br,hr
4）列表标记：
ul,ol,li,dl,dt,dd
5）超链接标记：
a,map,area
6）图像及媒体元素标记：
img,embed,object
7）表格标记：
table,tr,td,th,tbody
8）表单标记：
form,input,textarea,select,option,fieldset,legend
9）框架标记：
frameset,frame,iframe
10）容器标记：
div,span
11）单标记：
（强制换行），
（水平线），
![]()
，
，
，
12）成组标记：
table，form，ul,ol,dl,frameset，fieldset
行内元素和块级元素：
行内元素：
a，img，font（文字属性），b，i，u，span，input
块级元素：
p,div,hn,pre,hr,ul,ol,li,form
公共属性：
align（水平对齐方式），valign（垂直对齐方式），border（边框），title（提示文字），src（链接的文件路径），style（引入CSS行内样式），id，name
特有属性：
在HTML语言规范的基础上，XHTML对标记还有下面一些额外的要求：
1）标记名和属性名、属性值必须小写；
2）属性值必须用双引号引起；
3）所有标记包括单标记都必须封闭；
4）不允许省略属性值。
</p><p>
（上下）一个段落的文字内容
左右顺序排列的文字
保持文本内容的原形
强制不换行
color="#FF0000"（颜色）align="center"（水平对齐方式）/>
粗体文字
斜体文字
加下划线
加粗，倾斜
内容（上标）
...（下标）
文字内容（编辑文字的属性）
首页（超链接）
......（无序列表）
ol,li（有序列表）
一个定义列表：
- 计算机
（标题）- 用来计算的仪器......
（文段内容）- 显示器
- 以视觉方式显示信息的装置......
table表格：
... | （表头）
…（表格标题）
（行）| ... | （列ttr）
表格table标签的属性：
1、width属性：
指定表格或某一个表格单元格的宽度。
单位可以是%或者象素。
2、height属性：
指定表格或某一个表格单元格的高度。
单位可以是%或者象素。
3、border属性：
表格边线粗细
4、bordercolor属性：
指定表格或某一个单元格的边框颜色。
5、bordercolorlight属性：
亮边框的颜色
6、bordercolordark属性：
暗边框的颜色c
7、bgcolor属性：
指定表格或某一个单元格的背景颜色。
8、background属性：
指定表格或某一个单元格的背景图片。
其属性值为一个URL地址。
表格tr标签的属性：
1、valign属性：
指定某一个单元格里的内容（文本、图片等）的垂直对齐方式。
垂直对齐方式的属性值包括：
top：
顶端对齐；
middle：
居中对齐；
bottom：
底端对齐。
Baseline：
相对于基线对齐。
2、align属性：
指定表格或某一个单元格里的内容（文本、图片等）的对齐方式
3、height属性：
指定表格或某一个表格单元格的高度。
单位可以是%或者象素
表格td标签的属性：
1、valign属性：
指定某一个单元格里的内容（文本、图片等）的垂直对齐方式。
垂直对齐方式的属性值包括：
top：
顶端对齐；
middle：
居中对齐；
bottom：
底端对齐。
Baseline：
相对于基线对齐。
2、Colspan：
属性值表示当前单元格跨越几列（合并行内单元格）
3、Rowspan：
属性值表示当前单元格跨越几行（合并列单元格）
跑马灯：
onmouseover=this.stop（）onmouseout=this.start（）height="120"（光标移到指定范围就开始或停止）>.........
超链接：
1）用文本做超链接：
首页
2）用图像做超链接：
3）文本图像混合做链接：
格力空调1型
该方法在商品展示
的网站上较常用。
4）热区链接：
使用map在图像上定义一幅地图，地图上可包含多个热区，每个热区用area单标记定义，area的shape属性定义了热区的形状，coords定义了热区的坐标点，href定义了热区链接的文件。
同时img标记用usemap指明用了哪幅地图
5）链接到其他网页或文件（jpg,rar等）
内部链接返回首页
外部链接网易网站
下载链接点击下载
6）电子邮件链接
xiaoli@">给我留言
演示：
mail.html
target属性的取值：
-self（在本窗口打开）、-blank（空白窗口）、_parent（将链接的文件载入到父框架）、_top（将链接的文件载入到整个浏览器窗口中，并删除所有框架）
title的属性：
title属性在很多标记里都有，其作用是在鼠标停留在该元素上时显示设置的说明文字
制作超链接的规则：
1）可以使用相对链接尽量不要使用绝对链接，如../index.htm
而不是
2）链接目标尽可能简单
如，而不是
css
内联样式，具有最高优先级（写在标记里面）
内部样式表，优先级低于内联样式（head添加style标记）
外部样式表，优先级最低（新建css）
css基本写法
选择符{
属性：
属性值；}
p{
属性：
属性值；}
（1）类型选择符（整体效果一致）
p{属性：
属性值；
}
我的样式表
第二段落
第三段落
（2）类选择符（在整体上实现不一致的效果）
.div1{属性：
属性值；
}
.div2{属性：
属性值；
}
.left{属性：
属性值；
}
.right{属性：
属性值；
}
我的样式表