网页前端开发之HTML标签语义(web前端开发网页代码)

2024-03-03    分类: 网站建设

HTML标签的设计都是有语义考虑的,下表是部分标签的全称和中文翻译。
 标签名英文全拼中文翻译divdivision分隔spanspan范围olordered list排序列表ulunordered list不排序列表lilist item列表项目dldefinition list定义列表dtdefinition term定义术语dddefinitiion description定义描述deldeleted删除insinserted插入h1~h6header 1 to header 6标题1到标题6pparagraph段落hrhorizontal rule水平尺aanchor锚abbrabbreviation缩写词acronymacronym取首字母的缩写词addressaddress地址varvariable变量prepreformatted预定义格式blockquoteblock quotation区块引用语strongstrong加重ememphasized加重bbold粗体iitalic斜体bigbig变大smallsmall变小supsuperscripted上标subsubscripted下标brbreak换行centercenter居中fontfont字体uunderlined下划线sstrikethrough删除线fieldsetfieldset城集legendlegend图标captioncaption标题
其中,div和soan其实是没有语义的,它们只是分别用作块级元素和行内元素的区域分隔符。

如何确定你的标签是否语义良好
 判断网页标签语义是否良好的一个简单方法就是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。
   语义良好的网页去掉样式后结构依然很清晰。
同样的设计图,不同的HTML标签可以通过不同的CSS实现同样的页面,但语义不好的CSS布局和语义良好的CSS布局在去样式后的表现却可能截然不同。
如果选用的标签几乎全是不带语义的,那么在去样式后网页中几乎看不到任何结构信息,可读性非常差;如果选用的都是语义适合的标签,去样式后网页依然具有非常好的可读性。

所以我们的开发过程中,不要拿到一个任务后就马上开始写代码,在拿到设计稿后不要急于马上进行开发,而是先根据页面结构进行分析,先考虑好框架,适用的标签等,会让整个开发过程更有规划、更顺畅,是一个先慢后快的过程。反之就可能出现先快后慢的局面,越到后期开发速度越慢,反复修改bug、打补丁。

以上就是关于网页前端开发之HTML标签语义(web前端开发网页代码),希望对你有帮助,更多内容关注创新互联。

标题名称:网页前端开发之HTML标签语义(web前端开发网页代码)
链接地址:https://www.cdcxhl.com/news30/319930.html

成都网站建设公司_创新互联,为您提供用户体验建站公司云服务器品牌网站建设营销型网站建设小程序开发

广告

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

成都网站建设公司