html-w3c规范及常见标签

 

W3C提倡的web结构：

内容（HTML）与表现（css样式）分离

内容（HTML）与行为（JS）分离

HTML内容结构要求语义化

基本规范：

标签名和属性名称必须小写

HTML标签必须关闭

属性值必须用引号括起来

标签必须正确嵌套（标签不能交叉）

 

 

超级链接

 

*（了解）rel：用于表明被链接文档与当前文档的关系：

      rel="prev"（被链接文档是）前一篇文档 rel="next"（被链接文档是）后一篇文档

rel="icon" 被链接图片是当前文档的图标 rel="stylesheet"被链接文档是当前文档的样式表

      rel="prefetch"预加载；在当前文档加载完成后，利用空余时间预加载即将链接的文档

 

锚点语法：

锚链接：

       ① 本页面锚链接：a.设置锚点：<a name="top"></a>

                                          b. 在超链接上，使用#name 跳转到对应锚点。

              ② 页面间锚链接：a.在即将跳转页面的指定位置，设置锚点

                                   b.在超链接的href属性中使用"页面地址.html#name"

                                    <a href="text.html#name">跳转到新页面指定部分</a>

        功能性链接：mailto://********* @qq.com用于给指定邮箱发送邮件

 

                                 tencent://message/?uin=********* 给指定QQ发送消息

 

 

                                 file:///e:/aaa.png 打开本地文件

补充img属性

align：设置图片周围文字相对于图片的位置。top、center、bottom

这里以center为例

 

 

 

认识即可（

S有误文本：删除线

 

cite标签：浏览器显示为倾斜。常用与书、画作、作品的引用

 

u：下划线

 

）

code：只是表示计算机代码，但是浏览器只会显示等宽字体，不会保留代码格式，需配合pre标签使用

 

bdo：表示文本方向，dir="ltr"从左往右 dir="rtl"从右往左

 

kbd：表示需要用户用键盘输入的内容，浏览器显示为等宽字体

 

sup:上标文本  sub：下标文本

 

【补充】版权符号：&copy   ©

 

H5新增标签

   Data：主要用于定义机器可读的数据格式。

   Time：Data标签的时间文本，data元素的特例

   Mark：高亮或标记文本，浏览器显示为黄色背景

 

 

为什么使用表格

 

基本布局

 

表格标签的属性

表格 table

表格的行：<tr></tr>     每行中的列：<td></td>

表格的表头：<th></th>  默认加粗，单元格居中

  【常用属性】

1、border：给表格添加边框，当border属性增大时，只有外围框线增加，单元格的边框线始终为1px

 

    2、Cellspacing：单元格与单元格之间的间隙距离，当Cellspacing="0"时，只会使单元格间隙为0，但不会合并边框线。【表格边框合并】style="border-collapse: collapse;":无需再写Cellspacing="0"

 

 

    3、Cellpadding：每个单元格中的内容与边框线的距离。

 

    4、Width、Height：表格的宽高

    5、align：表格在屏幕的左中右位置显示。 left center right

>>>注意：给表格加上align属性相当于让表格浮动。会直接打破表格后面元素的原有排列方式。

（这里以right为例）

 

 

    6、Bgcolor：背景色 等同于style="background-color:;"

 

    7、Background：背景图片 等同于style="background-image:;"且背景图会覆盖背景色

 

    8、Bordercolor：边框颜色

 

 

行及单元格标签的属性

【tr和td相关的属性（td同样好使）】

1、width/height：单元格的宽高

2、bgcolor：单元格的背景颜色

3、align：left center right 单元格中的文字水平对齐方式

4、valign：top center bottom 单元格中的文字垂直对齐方式

5、nowrap：nowarp="nowrap" 单元格中文字不换行

注意：

                1、当表格属性与行列属性冲突时，以行列属性为准；（近者优先）

                2、表格的align属性，是控制表格自身在浏览的的显示位置，行和列的algin属性，是控制         单元格中文字在单元格中的对齐方式；

                3、表格的align属性，并不影响表格内文字的水平对齐方式

                      tr的align属性，可以控制一行中所有单元格的水平对其方式

【表格的跨行跨列】

              colspan 跨列，当某个格跨N列时，其右边N-1个单元格需删除

rowspan 跨行，当某个格跨N行时，其下方N-1个单元格需删除

*

 

 

null