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:下标文本


【补充】版权符号:© ©
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规范及常见标签的更多相关文章
- html5 Doctor——教你规范使用html5标签
学习地址(英文资料):http://html5doctor.com/ http://www.w3.org/html/wg/drafts/html/master/text-level-semantics ...
- Html 常见标签,css基础样式,css的浮动和清流,浏览器的兼容
1.html模板<!DOCTYPE html><html><head> <meta charset="UTF-8"> <tit ...
- W3C规范学习
w3c:万维网联盟(World Wide Web Consortium,W3C),又称W3C理事会.W3C组织是对网络标准制定的一个非赢利组织,W3C是万维网联盟的缩写,像HTML.XHTML.CSS ...
- 1、前端--HTML简介、head内常见标签、body内常见标签(特殊符号、div、span、a、img、列表、表格table、表单form)、标签两大属性
今日内容 HTML简介 HTML是构造网页的骨架>>>:几乎所有的网站都是由HTML构建而成 HTML:超文本标记语言 # 不是一门编程语言 没有任何的逻辑 只有固定的标记功能 &q ...
- W3C规范
连接:https://www.w3cschool.cn/xuexiw3c/xuexiw3c-standards.html W3C 代码标准规范 由 路飞 创建, 最后一次修改 2017-01-03 W ...
- 常见标签的默认属性值及相互作用——关于CSS reset的思考
在现在的网站设计中使用reset.css用重置整个站点的标签的CSS属性的做法很常见,但有时候我们已经为了reset而reset,我们经常看到这样的reset代码 div{ padding:0px; ...
- 【html5】常见标签使用说明(持续更新)
说明: 所谓常见,是指我在优秀网页源码中见到的. 1.viewport 我见到的时候是这样: <meta name="viewport" content="widt ...
- HTML常见标签总结
什么是浏览器 解释和执行HTML源码的工具 五大浏览器:IE.FF(FireFox)(火狐).Chrome(谷歌).Opera(空中).Safari(Apple)(苹果) IE用的是Trident引擎 ...
- HTML常见标签学习与笔记总结
HTML其实就是把页面的数据封装并加上标签 表头<head> <title> 浏览器标题栏显示的内容 <base> 有href和target属性,href指定网页中 ...
随机推荐
- crontab下设置ntpdate的问题
1.在crontab里设置了ntpdate 同步时间,一段时间发现没有起作用 原来的写法是 20 00 × × × ntpdate cn.pool.ntp.org 单独拿出来执行也是没问题的,最近好好 ...
- Spark Standalone Mode 单机启动Spark -- 分布式计算系统spark学习(一)
spark是个啥? Spark是一个通用的并行计算框架,由UCBerkeley的AMP实验室开发. Spark和Hadoop有什么不同呢? Spark是基于map reduce算法实现的分布式计算,拥 ...
- Design Patterns Example Code (in C++)
Overview Design patterns are ways to reuse design solutions that other software developers have crea ...
- centos下apache安装
./configure --prefix=/usr/local/apache2 --enable-so --enable-proxy --enable-proxy-connect --enable-p ...
- python中的抽象方法
python中的抽象方法 父类要限制1.子类必须有父类的方法2.子类实现的方法必须跟父类的方法的名字一样 import abc class A(metaclass=abc.ABCMeta): @abc ...
- linux 系统性能指标
一.查看CPU使用情况 cpu使用率反映的是当前cpu的繁忙程度,忽高忽低的原因在于占用cpu处理时间的进程可能处于io等待状态但却还未释放进入wait. 平均负载(loadaverage)是指某段时 ...
- 9.如何让ubuntu的ssh免密码登录
ubuntu 默认已安装了 SSH client,此外还需要安装 SSH server: sudo apt-get install openssh-server 安装后,可以使用如下命令登陆本机: s ...
- Oracle 常见问题汇总
1.Listener refused the connection with the following error 安装之后如果遇到如下问题状态: 失败 -测试失败: Listener refuse ...
- 关于在MFC的视图类里面添加各种控件 以及给这些控件添加对用的函数。2015-03-24 13:46:00
首先我们把题目所示的要求分为两个问题: 问题一:如何给基于MFC的单文档视图类里面添加 控件.就是那种类似工具箱里面的控件. 问题二:如何给已经添加的控件 定义一些消息的响应函数. ××××××××× ...
- Flask之flask-script模块使用
Flask Script扩展提供向Flask插入外部脚本的功能,包括运行一个开发用的服务器,一个定制的Python shell,设置数据库的脚本,cronjobs,及其他运行在web应用之外的命令行任 ...