前端基础-HTML标记语言
阅读目录
一、 HTML标签与文档结构
HTML作为一门标记语言，是通过各种各样的标签来标记网页内容的。我们学习HTML主要就是学习的HTML标签。
那什么是标签呢？
#1、在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来，如`<html>`、`<head>`、`<body>`都是标签， #2. HTML中标签通常情况下是成对出现的，分为开始标签和结束标签，结束标签比开始标签多了一个`/`，开始标签和结束标签之间的就是标签的内容。 #3、有些标签功能比较简单，使用一个标签即可，这种标签叫做自闭和标签，例如:<br/> <hr/> <input/> <img/>
HTML中的标签存放于文本文件中，需要按照下述固定的文档结构组织：
<!DOCTYPE HTML>
<html>
<head>...</head>
<body>...</body>
</html>
各部分解释
#1、<!DOCTYPE HTML>是文档声明，必须写在HTML文档的第一行，位于<html>标签之前，表明该文档是HTML5文档。 #2、<html></html> 称为根标签，所有的网页标签都在<html></html>中。 #3、<head></head> 标签用于定义文档的头部，它是所有头部元素的容器。
常见的头部元素有<title>、<script>、<style>、<link>和<meta>等标签，头部标签在下一节中会有详细介绍，
<head>与</head>之间的内容不会在浏览器的文档窗口显示，但是其间的元素有特殊重要的意义。 #4、在<body>和</body>标签之间的内容是网页的主要内容，最终会在浏览器中显示出来。
标签间关系
#1、并列（兄弟／平级）
head与body
#2、嵌套（父子／上下级）
html内有body
二、 HTML标签详细语法与注意点
标签的语法：
<标签名 属性1=“值1” 属性2=“值2” ......>内容部分</标签名>
<标签名 属性1=“值1” 属性2=“值2” ....../>
注意：
#1. HTML标签不区分大小写，`<h1>`和`<H1>`是一样的，但是我们通常建议使用小写，大部分程序员都以小写为准。 #2. 标签之间是可以嵌套的。例如：<div><p>段落</p></div>,但不能交叉<div><p></div></p> #3、不是所有标签都支持互相嵌套。
三、 HTML中标签分类
单从是否可以嵌套子标签的角度去分，标签分为两类
#1、容器类标签
容器类标签可以简单的理解为能嵌套其它所有标签的标签。
常见容器级的标签:
h系列
ul>li
ol>li
dl>dt+dd
div #2、文本类标签
文本级的标签对应容器级标签，只能嵌套文字/图片/超链接的标签。
常见文本级的标签:
p
span
strong
em
ins
del
四、 HTML注释
无论我们学习什么编程语言，一定要重视的就是注释，我个人一直把注释看成是代码之母。 HTML中注释的格式:
<!--这里是注释的内容-->
注意： 注释中可以直接使用回车换行。
并且我们习惯用注释的标签把HTML代码包裹起来。如：
<!-- xx部分 开始 -->
这里放你xx部分的HTML代码
<!-- xx部分 结束 -->
HTML注释的注意事项：
#1、HTML注释不支持嵌套。
#2、HTML注释不能写在HTML标签中。
前端基础-HTML标记语言的更多相关文章
- Java学习-033-JavaWeb_002 -- 网页标记语言JSP基础知识
JSP 是 Sun 公司提倡的一门网页技术标准.在 HTML 文件中,加入 Java 代码就构成了 JSP 网页,当 Web 服务器访问 JSP 请求的时候,首先执行其中的 Java 程序源码,然后以 ...
- Html就是超文本标记语言的简写，是最基础的网页语言
Html就是超文本标记语言的简写,是最基础的网页语言. Html是通过标签来定义的语言,代码都是由标签所组成. Html代码不用区分大小写. Html代码由<html>开始</htm ...
- 关于XML(可扩展标记语言)的基础知识与写法------2017-05-18
XML(Extensible Markup Language) HTML:超文本标记语言,主要用来展示 XML:可扩展标记语言,用来做数据传输XML特点: 1.树状结构,有且只有一个根 2.标签名 ...
- 关于XML（可扩展标记语言）的基础知识与写法
XML(Extensible Markup Language) HTML:超文本标记语言,主要用来展示 XML:可扩展标记语言,用来做数据传输XML特点:1.树状结构,有且只有一个根2.标签名自定 ...
- web前端基础知识-（八）Ajax
Ajax即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,AJAX = 异步 Ja ...
- web前端基础知识及快速入门指南
web前端基础知识及快速入门指南 做前端开发有几个月了,虽然说是几个月,但是中间断断续续的上课.考试以及其它杂七杂八的事情,到现在居然一直感觉自己虽然很多前端的知识很眼熟,却也感觉自己貌似也知识在门口 ...
- HTML+DIV+CSS+JSweb前端基础
HTML+DIV+CSS+JSweb前端基础 1.<html>和</html> 标签限定了文档的开始和结束点. 属性: (1) dir: 文本的显示方向,默认是从左向右 (2 ...
- 前端基础面试题(JS部分)
1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String 值类型:数值.布尔值.null.und ...
- 前端基础：HTML标签(上)
前端基础:THML HTML初始 1.web服务本质 import socket sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM) so ...
随机推荐
- [CF816E] Karen and Supermarket1 [树形dp]
传送门 - > \(CF816E\) Karen and Supermarket 题意翻译 在回家的路上,凯伦决定到超市停下来买一些杂货. 她需要买很多东西,但因为她是学生,所以她的预算仍然很有 ...
- oracle的rownum使用
对于rownum来说它是Oracle系统顺序分配为从查询返回的行的编号,返回的第一行分配的是1,第二行是2,依此类推,这个伪字段可以用于限制查询返回的总行数,且rownum不能以任何表的名称作为前缀. ...
- ubuntu12.04 Qt WebKit编译
转载自:http://my.oschina.net/u/257674/blog/167050 官方文档: http://trac.webkit.org/wiki/BuildingQtOnLinux#D ...
- 关于跨域策略文件crossdomain.xml文件--配置实例
转载自:http://bbs.phpchina.com/blog-52440-191623.html 我一直不太明白crossdomain.xml文件是干嘛用的,今天总算比较清楚的知道了一下. 这是F ...
- js实现日历
有这样一个普通的日历需求 第一反应就是找插件,结果找到了,但是改起来非常麻烦,然后查下实现的原理,发现原来很简单,于是自己实现了一个. 首先分析一下这个组件,每页显示的是 当前月的所有日期及所占据的行 ...
- oracle中函数
一:前言 最近决定每天都把知识点总结下,然后每个星期把知识点在进行分类发表日志. 二:The Question (1):在oracle中进行年龄的计算,知道出生日期进行计算后截取,本来是一个很简单的函 ...
- TCP（二）
TCP半连接和全连接问题 TCP握手过程详解 如上图所示,关键部分:syns queue(半连接队列)和accept queue(全连接队列) 正常情况下的处理过程如下: 1)当server端收到cl ...
- bzoj 4569 [Scoi2016]萌萌哒 并查集 + ST表
题目链接 Description 一个长度为\(n\)的大数,用\(S_1S_2S_3...S_n\)表示,其中\(S_i\)表示数的第\(i\)位,\(S_1\)是数的最高位,告诉你一些限制条件,每 ...
- GIt 和 Github
原创 by zoe.zhang GitHub中采用的比较多得是markdown的语法,博客园里对markdown的支持感觉不是特别友好,但是为了应景,还是用了markdown来写这一篇文 ...
- Java坦克大战 (二) 之画一个能动的圆圈代表坦克
本文来自:小易博客专栏.转载请注明出处:http://blog.csdn.net/oldinaction 在此小易将坦克大战这个项目分为几个版本,以此对J2SE的知识进行回顾和总结,希望这样也能给刚学 ...