学习html语法的规范性

  不管学习什么语言第一开始都是在学习其语法规范,前端也不例外,首先我们讲解一下学习前端语言所使用的编辑器,现在在市面上大多使用的编辑器有: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这部分内容个人建议在学习的过程中先记忆每一个元素的基本默认样式及常用于哪些地方,至于它们之间该如何嵌套比较的合适,一方面自己要使用一下,另一方面要看别的案例加以学习及总结。

时间: 2024-12-31 03:30:54

学习html语法的规范性的相关文章

程序员带你学习安卓开发,十天快速入-对比C#学习java语法

关注今日头条-做全栈攻城狮,学代码也要读书,爱全栈,更爱生活.提供程序员技术及生活指导干货. 如果你真想学习,请评论学过的每篇文章,记录学习的痕迹. 请把所有教程文章中所提及的代码,最少敲写三遍,达到熟悉的效果. 上次课程:.程序员带你学习安卓开发,十天快速入门-开发工具配置学习讲的是java环境的配置以及as安装工具的安装. 其中有网友@鹅鹅鹅_说道,其实jdk的环境变量配置,不用配置的那么麻烦了.当前的jdk版本只要设置一个变量javahome就可以了,其他的可以不需要配置.在这里提一下.

WPF学习------XAML 语法详述

XAML 语言规范 XAML 语言规范中也定义或引用了此处定义的 XAML 语法术语. XAML 是一种基于 XML 并遵循或扩展 XML 结构规则的语言. 其中某些术语共享自或基于描述 XML 语言或 XML 文档对象模型时常用的术语. 有关 XAML 语言规范的更多信息,请从 Microsoft 下载中心下载 [MS-XAML]. XAML 和 CLR XAML 是一种标记语言. 顾名思义,公共语言运行时 (CLR) 实现了运行时执行. XAML 本身并非 CLR 运行时直接使用的一种公共语

VBA 开发学习--基础语法2

VBA中的运算符 算数运算符及其作用 + 求两个数的和 -  求两个数的差:求一个数的相反数 *  求两个数的积 /   求两个数的商(保留小数位   5/2=2.5) \   整除 (保留整数位  5\2=2) ^  指数运算(5^3=5*5*5=125) Mod  两数相除取余数  12 Mod 9=3 比较运算符 =   等于 <   小于 > 大于 <= 小于或等于 >= 大于或等于 <> 不等于 IS  比较两个对象的引用变量 Like   比较两个字符串是否

使用WSDL发布WebService(第二部分)简单对象访问协议——学习SOAP语法和使用SOAP发布WSDL

使用WSDL发布WebService(第二部分)简单对象访问协议——学习SOAP语法和使用SOAP发布WSDL http://www.ibm.com/developerworks/cn/webservices/ws-intwsdl/part2/#Listing1

学习mysql语法--基础篇(二)

  前  言  mysql  mysql语法--本篇学习都是通过使用Navicat Premium(数据库管理工具),连接mysql数据. 本篇学习主要有两个部分: [SQL语句的组成]   DML 数据操作语言(插入.删除和修改数据库中的数据)INSERT UPDATE DELETE   DQL 数据查询语言(用来查询数据库中的数据)SELECT   DCL 数据控制语言(用来控制存取许可.存取权限等)CREATE   DDL 数据定义语言(用来建立数据库.数据库对象和定义表的列)CREATE

学习mysql语法--基础篇(一)

  前  言  mysql  mysql语法--本篇学习都是通过使用Navicat Premium(数据库管理工具),连接mysql数据. 本篇学习主要有两个部分:    一.创建用户,创建数据库,给用户分配权限,删除用户权限.    二.MYSQL中常见的数据类型 三.表-创建表.主键.外键    四.数据库设计的三大范式 以下所有代码全部在新建查询表里面使用mysql语法编辑. 1.创建用户,创建数据库,给用户分配权限,删除用户权限. /* SQL 多行注释 */-- SQL 单行注释 创建

ios -- 教你如何轻松学习Swift语法(二)

前言:swift语法基础篇(二)来了,想学习swift的朋友可以拿去参考哦,有兴趣可以相互探讨,共同学习哦. 一.可选类型(重点内容) 1.什么是可选类型? 1.1在OC开发中,如果一个变量暂停不使用,可以赋值为0(基本属性类型)或者赋值为空(对象类型) 1.2在swift开发中,nil也是一个特殊的类型.因为和真实的类型不匹配是不能赋值的(swift是强类型语言) 1.3但是开发中赋值nil,在所难免.因此推出了可选类型 目的:让代码更加严谨 2.可选类型的取值 可选类型要么是:空值 , 要么

【转载】【MVC 学习 Razor语法】

Razor是MVC3中才有的新的视图引擎.我们知道,在ASP.NET中,ASPX的视图引擎依靠<%和%>来调用C#指令.而MVC3以后有了一套新的使用@标记的Razor语法,使用起来更灵活更简洁.下面通过一些简单示例让大家快速撑握Razor语法的使用. 准备工作 在演示Razor语法的使用之前,我们需要做一些准备工作. 1.打开VS创建一个ASP.NET MVC空项目,很简单,就不具体演示了. 2.添加一个Model.在项目的Models文件夹中添加一个名为Product的类.在这我们把前一篇

Mysql学习基础语法

-- Mysql  数 据 库 语 法 创建数据库 create database 数据库名; 创建表 create table 表名(id int,name varchar(20)    ); 复制表和数据 create table 复制后新的表名 select * from 旧表名: 复制表的结构 create table 复制后新的表名 select * from where 1=0 : 创建索引 create index 索引名 on 表名(列名): 创建视图 create view 视