网页前端开发之HTML标签语义

2023-03-21    分类: 网站建设

HTML标签的设计都是有语义考虑的,下表是部分标签的全称和中文翻译。
标签名 英文全拼 中文翻译 div division 分隔 span span 范围 ol ordered list 排序列表 ul unordered list 不排序列表 li list item 列表项目 dl definition list 定义列表 dt definition term 定义术语 dd definitiion description 定义描述 del deleted 删除 ins inserted 插入 h1~h6 header 1 to header 6 标题1到标题6 p paragraph 段落 hr horizontal rule 水平尺 a anchor 锚 abbr abbreviation 缩写词 acronym acronym 取首字母的缩写词 address address 地址 var variable 变量 pre preformatted 预定义格式 blockquote block quotation 区块引用语 strong strong 加重 em emphasized 加重 b bold 粗体 i italic 斜体 big big 变大 small small 变小 sup superscripted 上标 sub subscripted 下标 br break 换行 center center 居中 font font 字体 u underlined 下划线 s strikethrough 删除线 fieldset fieldset 城集 legend legend 图标 caption caption 标题
其中,div和soan其实是没有语义的,它们只是分别用作块级元素和行内元素的区域分隔符。
如何确定你的标签是否语义良好
判断网页标签语义是否良好的一个简单方法就是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
语义良好的网页去掉样式后结构依然很清晰。
同样的设计图,不同的HTML标签可以通过不同的CSS实现同样的页面,但语义不好的CSS布局和语义良好的CSS布局在去样式后的表现却可能截然不同。
如果选用的标签几乎全是不带语义的,那么在去样式后网页中几乎看不到任何结构信息,可读性非常差;如果选用的都是语义适合的标签,去样式后网页依然具有非常好的可读性。

文章名称:网页前端开发之HTML标签语义
文章链接:https://www.cdcxhl.com/news26/246326.html

成都网站建设公司_创新互联,为您提供网站改版云服务器企业建站网站内链Google定制网站

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

成都app开发公司