html骨架标记
第一讲
调出文件的扩展名：工具--文件夹选项--查看--去掉隐藏已知文件夹类型的扩展名
HTML是超文本标记语言，作用是控制网页内容，描述内容。
第二讲
Meta标记用于定义文件信息
1、meta标记用于定义文件信息，对网页文件进行说明，便于搜索引擎查找。放置于<head><head/>之间
2、设置关键字：
3、<meta name=”keywords” content=”value”>多个关键字内容之间可以用”,”分隔
4、设置描述：<meta name=”description” content=”value”>
5、设置作者：<meta name=”author” content=”作者名”>
6、设置字符集：<meta http-equiv=”content-type” content=”text/html;charset=gb2312”>
7、设置页面定时跳转：<meta http-equiv=”refresh” content=”2;URL=http://www.itcast.cn”/>
第三讲
1、editplus快捷键，复制一行：ctrl+j
2、网页主体标记body：注释<!---->；body属性：<body bgcolor=”背景颜色” background=”背景图像” text=”文本颜色” link=”链接文本颜色” vlink=”访问过的文本颜色” alink=”激活的链接文本颜色” leftmargin=”左边界” rightmargin=”右边界” topmargin=”上边界” bottommargin=”下边界”>
3、<font>标记：<font color=”文本颜色” size=”字号” face=”字体”>文本</font>
注：网页中的文本字体、字号一般通过CSS修饰
| 颜色 |
英文名称 |
十六位进制 |
颜色 |
英文名称 |
十六位进制 |
| 白色 |
white |
#FFFFFF |
黑色 |
black |
#000000 |
| 红色 |
red |
#FF0000 |
绿色 |
green |
#00FF00 |
| 蓝色 |
blue |
#0000FF |
灰色 |
gray |
#999999 |
4、写html代码时的流程：先写我们的控制内容的标记，内容比较重要，可以在语义上加强<strong>关键字</strong>；文章网页的主题--推荐使用<h1>文章标题</h1>
5、字符格式
| 功能 |
标记 |
| 加粗 |
<b>文本</b> |
| 斜体 |
<i>文本</i> |
| 加强语气（加粗） |
<strong>文本</strong> |
| 加强语气（斜体） |
<em>文本</em> |
| 下划线 |
<u>文本</u> |
| 删除线 |
<s>文本</s> |
| 上标 |
<sup>文本</sup> |
| 下标 |
<sub>文本</sub> |
6、段落标记：
格式：<p align=”对齐方式”>文本内容</p>
| 属性名称 |
属性值 |
说明 |
| align |
left |
左对齐（默认） |
| center |
居中 |
|
| right |
右对齐 |
段落标题：<hx align=”对齐方式”>文本内容</hx>
说明：x取值[1--6]hx内的文本会自动加粗显示。
Hx针对的对象是段落，而font针对的对象是任意文本。
换行（换行不换段）：<br/>
7、水平直线<hr/>
| 属性名称 |
属性值 |
说明 |
| size |
像素（绝对设置） |
以数字表示，属性值越大，线越粗 |
| 百分比（相对设置） |
以%表示，属性值越大，线越粗 |
|
| width |
像素（绝对设置） |
长度不会随着视窗的改变而改变 |
| 百分比（相对设置） |
长度会随着视窗的改变而改变 |
在xhtml中，所有的标签都必须要用属性值，如果没有，使用属性名，例如：noshade=”noshade”实体线
8、特殊标记
定义一个快引用：使文本缩进
格式：<blockquote cite=”被引用的url地址”>文本内容</blockquote>
预格式化：<pre></pre>；显示已经格式化好的文字，不加此标记的话，HTML浏览器会忽略所有空格和制表符。
9、在HTML文档中使用特殊字符
| 特殊字符 |
转义码 |
| 空格 |
|
| 版权号 |
© |
| 注册商标 |
® |
| “ |
" |
| & |
& |
| < |
< |
| > |
> |
10、列表标记用途：
（1）无序列表：<ul type=”项目符号类型”>
<li type=”项目符号类型”>内容1</li>
<li>内容2</li>
...
</ul>
| 参数值（必须小写字母） |
描述 |
| disc |
|
| circle |
|
| square |
|
（2）有序列表：<ol start=”列表起点” type=”项目符号类型”>
<li>内容1</li>
<li>内容2</li>
...
</ol>
| 属性名称 |
属性值 |
说明 |
| type |
1 |
表示以1,2,3,4来表示 |
| a |
表示以a,b,c,d来表示 |
|
| A |
表示以A,B,C,D来表示 |
|
| i |
表示以i,ii,iii来表示 |
|
| I |
表示以I,II,III来表示 |
（3）定义列表：
<dl>
<dt>标题1</dt>
<dd>内容1</dd>
<dd>内容2</dd>
<dt>标题1</dt>
<dd>内容1</dd>
<dd>内容2</dd>
</dl>
| 属性 |
说明 |
| <dl></dl> |
定义列表 |
| <dt></dt> |
表示一个项目 |
| <dd></dd> |
表示一个项目下的更详细的内容的解释 |
11、Web上支持的图片格式
（1）GIF（图形交换格式）：GIF格式文件最多只能保存256种颜色。该格式支持透明色，支持动画效果。
（2）JPEG（联合图像专家组）：该格式不支持透明色及动画，颜色可达1670万种。
（3）PNG（网络可移植格式）：该格式支持透明色，不支持动画，颜色从几种到1670万种。
12、图片标记：<img src=”图片的路径”/>
路径：绝对路径：提供目标文档的完整主机名称、路径信息、及文档全称
根相对路径：从站点根目录开始的路径，以”/”开头
相对路径：从当前文档开始的路径
图片与网页在同一个文件夹内：<img src=”01.png”/>
图片所在的文件夹与网页在同一个文件夹内：<img src=”pic/01.png”/>
图片所在的文件夹与网页所在的文件夹在同一个文件夹内(../表示向上一级)：<img src=”../01.png”/>
13、图片属性
| 属性名称 |
属性值 |
说明 |
| src |
URL |
图片的路径 |
| alt |
文本 |
规定图片的替代文本[图片无法显示时] |
| title |
文本 |
鼠标悬停时显示的内容 |
| width |
像素/百分比 |
设置图片宽 |
| height |
像素/百分比 |
设置图片高 |
| border |
数字 |
设置图象边框 |
| align |
left |
图片靠左，文字靠右 |
| right |
图片靠右，文字靠左 |
|
| top |
文字垂直居上靠 |
|
| middle |
文字垂直居中 |
|
| bottom |
文字垂直居下（默认） |
|
| vspace |
像素 |
定义图像顶部和底部的空白（垂直边距） |
| hspace |
像素 |
定义图像左侧和右侧的空白（水平边距） |