码迷,mamicode.com
首页 > Web开发 > 详细

学习html语法的规范性

时间:2017-06-26 00:38:33      阅读:242      评论:0      收藏:0      [点我收藏+]

标签:sublime   div   前端   span   sub   影响   节点   作用   webstorm   

    不管学习什么语言第一开始都是在学习其语法规范,前端也不例外,首先我们讲解一下学习前端语言所使用的编辑器,现在在市面上大多使用的编辑器有:sublime     webstorm   HB等等,其实前端语言就算是使用简单的记事本也可以进行编辑,编辑器只是开发过程中的一种工具,我们主要考虑的是使用何种编辑器能够提高我们的开发效率。在这里我们以sublime为编辑器说明。其次我们讲解一下前端中html的语法特性:html是有各种的标签组成,html只在乎标签的嵌套结构,嵌套关系,谁嵌套谁,和换行、空格无关,不影响页面的显示,但要严格按格式写,html中所有 文字之间有空格、换行、tab都将被折叠为一个空格显示也就是说html不是依据缩进来表示嵌套的,就是看标签的嵌套关系,但良好的缩进,代码更易读,压缩是为了追求极致的加载速度,所有没有换行、缩进。成对的标签要封闭。

html语法

使用四个空格的缩进,这是保证代码在各种环境下显示一致的唯一方式。

嵌套的节点应该缩进(四个空格)。

在属性上,使用双引号,不要使用单引号。

不要在自动闭合标签结尾处使用斜线 - HTML5 规范 指出他们是可选的。

不要忽略可选的关闭标签(例如, 和 </body>)

许多初学者都会或多或少的写错,但可能他们还不自知,因为效果一样能够输出,比如:双标签没有闭合,一些标点符号使用中文的,嵌套结构不正确等等。

html标签

html标签可分为容器级标签和文本级标签;

其中容器级标签主要有:div  h1-h6  ul>li   ol>li 等

它的特点是可以直接给元素设置宽高,且宽度默认是父级元素宽度的百分百,高度自适应,它非常的“霸道”,在标准文档流下不与其他的元素共存一行,但它可以嵌套任何的标签包括它本身,注意成组的标签不然ul>li ,ul的下一级只能写li  li下面可以嵌套任何的标签。

文本级标签 主要有:span  a  img   input p  等

它的特点是不能直接设置宽高,宽高世自适应内容的宽高,且在标准文档流下可以与其他的文本级元素共存一行 

每一个标签都有自己的的语义,及其所对应的默认样式,像是我们会经常使用div来布局只充当一个盒子的作用,ul>li这一组标签经常配合css用作导航条的部位。

以上只是前端中html的一些介绍,对于html这部分内容个人建议在学习的过程中先记忆每一个元素的基本默认样式及常用于哪些地方,至于它们之间该如何嵌套比较的合适,一方面自己要使用一下,另一方面要看别的案例加以学习及总结。

学习html语法的规范性

标签:sublime   div   前端   span   sub   影响   节点   作用   webstorm   

原文地址:http://www.cnblogs.com/lorraine-yy/p/7078366.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!