前端编码习惯 —— html篇

前言

作为一个前端工程师,我们可能每天都要写html、css、javascript,每个人写出来的代码都饱含着自己的个人的style也有自己的编码习惯和准则,下面和大家分享一下我的习惯和准则。

html

首先我们要对文档进行规范,就要添加来对文档进行规范。关于 w3c有相应的说明。

编码统一采用utf-8,即可

页中引css样式或js时,不需要加类型声明。如:

  1.  ...      

登录后复制

省略图片、样式、脚本以及其他媒体文件 URL 的协议部分(http:,https:),除非文件在两种协议下都不可用。这种方案称为 protocol-relative URL,相对协议URL。好处是无论你是使用 HTTPS 还是 HTTP 访问页面,浏览器都会以相同的协议请求页面中的资源,同时可以节省一部分字节。浏览器遇到相对 URL,会根据当前的网页协议,自动在 // 前面加上相同的协议。如当前网页是 http 访问,那么所有的相对引用 // 都会变成http://。https 同理。如果你在本地查看,协议就会变成 file://。这种用法几乎所有的浏览器都能支持,只有在 IE7/8 下会有一点小问题,就是通过相对 URL 引用的 CSS 文件(无论 或 @import )会被下载两遍。所以对性能有一点影响。

立即学习“前端免费学习笔记(深入)”;

  1. /* Not recommended */.example {  background: url("https://www.google.com/images/example");}/* Recommended */.example {  background: url("//www.google.com/images/example");}

登录后复制

标签、属性、属性名全部⼩写,属性值⽤”” (双引号) 引起来,每个双标签务必加对应的结束标签(单标签不遵循此标准,仍按原 html 标准,即不需要以”/>”结束)。提醒:IE 下的页⾯变形很多都与标签未闭合或嵌套错误有关系。

标签要按顺序合理嵌套.如:

  1. 需修改为:

登录后复制

⾥可以包含

,但是

⾥不允许包含

等块级元素;和的⼦级不允许嵌套以外的标签,的⼦级不允许出现和以外的标签;像div之类的标签只能放在li⾥⾯;的⼦级只允许嵌套

, , ,

以及标签,的⼦级只允许嵌套,

标签,

标签⾥可以有任意标签存在。如以下⼏种情况都是错误的:

  1.  

登录后复制                          

                需改为:                              

                    

标签必须被 或 包裹,和必须被包裹,类似的,

,

等表格类标签也不允许单独出现。

为了⽅便,建议

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    HTML的meta标签常见用法集锦

    2025-3-9 6:16:58

    编程技术

    HTML学习笔记

    2025-3-9 6:17:48

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索