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:边框颜色

 

、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个单元格需删除

*

html-w3c规范及常见标签的更多相关文章

  1. html5 Doctor——教你规范使用html5标签

    学习地址(英文资料):http://html5doctor.com/ http://www.w3.org/html/wg/drafts/html/master/text-level-semantics ...

  2. Html 常见标签,css基础样式,css的浮动和清流,浏览器的兼容

    1.html模板<!DOCTYPE html><html><head> <meta charset="UTF-8"> <tit ...

  3. W3C规范学习

    w3c:万维网联盟(World Wide Web Consortium,W3C),又称W3C理事会.W3C组织是对网络标准制定的一个非赢利组织,W3C是万维网联盟的缩写,像HTML.XHTML.CSS ...

  4. 1、前端--HTML简介、head内常见标签、body内常见标签(特殊符号、div、span、a、img、列表、表格table、表单form)、标签两大属性

    今日内容 HTML简介 HTML是构造网页的骨架>>>:几乎所有的网站都是由HTML构建而成 HTML:超文本标记语言 # 不是一门编程语言 没有任何的逻辑 只有固定的标记功能 &q ...

  5. W3C规范

    连接:https://www.w3cschool.cn/xuexiw3c/xuexiw3c-standards.html W3C 代码标准规范 由 路飞 创建, 最后一次修改 2017-01-03 W ...

  6. 常见标签的默认属性值及相互作用——关于CSS reset的思考

    在现在的网站设计中使用reset.css用重置整个站点的标签的CSS属性的做法很常见,但有时候我们已经为了reset而reset,我们经常看到这样的reset代码 div{ padding:0px; ...

  7. 【html5】常见标签使用说明(持续更新)

    说明: 所谓常见,是指我在优秀网页源码中见到的. 1.viewport 我见到的时候是这样: <meta name="viewport" content="widt ...

  8. HTML常见标签总结

    什么是浏览器 解释和执行HTML源码的工具 五大浏览器:IE.FF(FireFox)(火狐).Chrome(谷歌).Opera(空中).Safari(Apple)(苹果) IE用的是Trident引擎 ...

  9. HTML常见标签学习与笔记总结

    HTML其实就是把页面的数据封装并加上标签 表头<head> <title> 浏览器标题栏显示的内容 <base> 有href和target属性,href指定网页中 ...

随机推荐

  1. python基础-第六篇-6.2模块

    python之强大,就是因为它其提供的模块全面,模块的知识点不仅多,而且零散---一个字!错综复杂 没办法,二八原则抓重点咯!只要抓住那些以后常用开发的方法就可以了,哪些是常用的?往下看--找答案~ ...

  2. 一篇搞定MongoDB

    MongoDB最基础的东西,我这边就不多说了,这提供罗兄三篇给大家热身 MongoDB初始 MongoDB逻辑与物理存储结构 MongoDB的基础操作 最后对上述内容和关系型数据做个对比 非关系型数据 ...

  3. RESTful HTTP的实践(转)

    add by zhj: 文章有点老了,2009年的,到现在已经六年了,不过还是很有参考价值的. 另外,吐槽一下PUT method,竟然允许用户用实例号来创建,靠,这也行,实例号还是后台来定义比较方便 ...

  4. Ningx代码研究.

    概述 研究计划 参与人员 研究文档 学习emiller的文章 熟悉nginx的基本数据结构 nginx 代码的目录结构 nginx简单的数据类型的表示 nginx字符串的数据类型的表示 内存分配相关 ...

  5. redis之django-redis

    自定义连接池 这种方式跟普通py文件操作redis一样,代码如下: views.py import redis from django.shortcuts import render,HttpResp ...

  6. 一行代码让python的运行速度提高100倍

    python一直被病垢运行速度太慢,但是实际上python的执行效率并不慢,慢的是python用的解释器Cpython运行效率太差. “一行代码让python的运行速度提高100倍”这绝不是哗众取宠的 ...

  7. Django restframwork实现自定义数据格式的分页与搜索

    最近因为在做分页时遇到的问题很多,页浪费了好多时间,所以记录一下.以后如遇到可用省去不必要的麻烦 restframwork中的官方文档对分页和搜索页进行了详细的介绍,但是我公司需要的return的js ...

  8. ruby on rails 数据库操作

    (1)增加列的操作 rails generate migration add_password_digest_to_students password_digest:string bundle exe ...

  9. 列表中相同key的字典相加

    # 怎么把列表中相同key的字典相加,也就是id的值加id的值,doc_count的值加doc_count的值 # 目标列表 l=[{'id': 5, 'doc_count': 129}, {'id' ...

  10. 160726 smarty 笔记(2)

    <?php //取当前页 $p=1; if(!empty($_GET["page"])) { $p=$_GET["page"]; } //定义页面缓存文件 ...