一.html标签又叫做html元素，它分为块级元素和内联元素（也可以叫做行内元素），都是html规范中的概念。
1.块级元素
块级元素是指本身属性为display:block;的元素。因为它自身的特点，我们通常使用块级元素来进行大布局（大结构）的搭建。
块级元素的特点：
独占一行，从上到下排布
可设宽度、高度，margin，padding
在不设置宽度，宽度是它父级元素，高度是它本身内容撑开的高度
内部可容文本，纳块级元素，以及内联元素
常用的块级元素
div
常用块级容器，也是css layout的主要标签
h1-h6
标题 大到小
hr
水平分隔线
ol,ul,li
有序,无序列表,(列表项)
dl,dt,dd
自定义列表,标题（特别的项目）,项目
table（内部thead>tr>th,td标签与table连用,单独无法使用）
表格
p
段落
form
交互表单
2.内联元素
内联元素是指本身属性为display:inline;的元素。因为它自身的特点，我们通常使用内联元素来进行文字、小图标（小结构）的搭建。
内联元素的特点：
从左到右在一行显示
设宽高无效,只能设置内外边距左右,,....以知：img,video,audio标签特殊   可以设置宽高，margin，padding；
宽高由内容撑开
只能容纳文本，内联元素
常用的内联元素
span
常用内联容器，定义文本内区块
a锚点
img
引入图片
b
加粗
strong
加粗强调
i
斜体
em
斜体强调
s
中划线（不推荐使用）
strike
中划线
del
文档中已被删除的文本
br
强制换行
u
下划线
textarea
多行文本输入框
input
输入框
select
下拉列表
label
input 元素定义标注（标记）
sub
下标
sup
上标
big
大字体文本
small
小字体文本
备注:W3C在最新的HTML5规范中对元素的分类方式:
元素的分类不再是块元素或内联元素这样来分类（其实从来就没有这样分），而是按照如下分类来分：Flow（流式元素）、Heading（标题元素）、Sectioning（章节元素）、Phrasing（段落元素）、Embedded（嵌入元素）、Interactive（交互元素）、Metadata（元数据元素）。
根元素:<html>
文档元数据:<link>、<meta>、<style>、<style>
内容分区:<header>、<nav>、 <section>、<aside> 、<footer> 、<h1>~<h6> 、<article> 、<address>、<hgroup>
文本内容:<main>、<div>、<p>、<pre>、<ol>、 <ul>、<li>、<dl> 、<dt>、<dd>、<figure> 、<figcaption>、<blockquote> 、<hr>
内联文本语义:<span>、<a>、<strong>、<em>、<q>、<br>、<mark>、<code>、<abbr>、<b>、<bdi>、<bdo>、<sub>、<sup>、<time>、<i>、<u>、<cite>、<data>、<kbd>、<nobr>、<s>、<samp>、<tt>、<var>、<wbr>、<rp>、<rt>、<rtc>、<ruby>
图片和多媒体:<img><audio> <video><track><map><area>
内嵌内容:<iframe>、<embed>、<object> 、<param>、<picture>、<source>
脚本:<canvas>、<noscript>、<script>
编辑标识:<del>、<ins>
表格内容:<table>、<caption>、<thead>、<tbody>、<tfoot>、<tr>、、<col><colgroup>、<th>、<td>
表单:<form> 、<input>、<textarea> 、<label>、<button>、<datalist>、<fieldset>、<legend>、<meter>、<optgroup>、<option>、<output>、<progress>、<select> 交互元素<details>、<summary>、<dialog>、<menu> Web 组件:<slot>、<template> 过时的和弃用的元素:<acronym><applet><basefont><bgsound><big><blink><center><command><content><dir><element><font><frame><frameset><image><isindex><keygen><listing><marquee><menuitem><multicol><nextid><nobr><noembed><noframes><plaintext><spacer><strike><shadow><tt><xmp>
二.标签嵌套规则
 内联元素不能嵌套块元素。
p元素和<h1~6>元素不能嵌套块元素。

web@HTML常用标签分类，标签嵌套规则的更多相关文章

  1. Unit 3.标签的分类和嵌套规则

    一.标签分类 HTML中标签元素三种不同类型:块状元素,行内元素,行内块状元素. 常用的块状元素: <div> <p> <h1>~<h6> <ol ...

  2. HTML标签的嵌套规则

    我在平时在写html文档的时候,发现不太清楚标签之间的嵌套规则,经常是想到什么标签就用那些,后来发现有些标签嵌套却是错误的.通过网上找资料,了解了html标签的嵌套规则. 一.HTML 标签包括 块级 ...

  3. web前端（6）—— 标签的属性，分类，嵌套

    属性 HTML标签可以设置属性,属性一般以键值对的方式写在开始标签中 1.HTML标签除一些特定属性外可以设置自定义属性,一个标签可以设置多个属性用空格分隔,多个属性不区分先后顺序. 2.属性值要用引 ...

  4. 从零开始学习前端开发 — 9、标签嵌套规则及CSS常用样式覆盖

    1. 块级元素可以包含内联元素或某些块级元素,但内联元素却不能包含块级元素,它只能包含其它的内联元素: <div><h1></h1><p></p& ...

  5. HTML5标签嵌套规则

    × 目录 [1]分类 [2]子元素 [3]总结 前面的话 在html5中,<a>元素的子元素可以是块级元素,这在以前是被认为不符合规则的.本文将详细介绍html5的标签嵌套规则 分类 ht ...

  6. XHTML标签的嵌套规则分析

    在 XHTML 的语言里,我们都知道:ul 标签包含着 li.dl 标签包含着 dt 和 dd——这些固定标签的嵌套规则十分明确.但是,还有许多标签是独立的,它们没有被捆绑在一起,比如 h1.div. ...

  7. 前端入门html（常用标签及标签分类）

    day47 参考:https://www.cnblogs.com/liwenzhou/p/7988087.html 任何标签都有有三个属性:ID,class.style <!DOCTYPE ht ...

  8. XHTML标签的嵌套规则--很基础很重要

    XHTML的标签有许多:div.ul.li.dl.dt.dd.h1~h6.p.a.addressa.span. strong……我们在运用这些标签搭建页面结构的时候,是可以将它们无限嵌套的,但是,嵌套 ...

  9. html标签的嵌套规则分析

    1.a标签最好不要嵌套块级元素,可以嵌套内联元素,但是不能嵌套a标签和input之类的标签.能嵌套的标签像,等等. 2.ul和ol的子元素不能是别的元素只能是li,不能是别的比如div等,但是li中可 ...

随机推荐

  1. idea代码回退到前面的版本

    好多时候一个项目添加了新功能,导致整个项目不能运行,而之前的版本又没有保存.怎么办了?回退到以前的版本就OK啦, 没错IDEA就是这个智能化. 第一步:点击项目名称->右键->选择Loca ...

  2. oracle修改密码为永久不过期

    sqlplus /as sysdba ALTER PROFILE DEFAULT LIMIT PASSWORD_LIFE_TIME UNLIMITED;

  3. Java8新特性 重复注解与类型注解

    import java.lang.annotation.Repeatable; import java.lang.annotation.Retention; import java.lang.anno ...

  4. JS创建对象之动态原型模式

    动态原型模式把所有信息都封装在了构造函数中,而通过在构造函数中初始化原型(仅在必要的情况下),又保持了 同时使用构造函数和原型的优点:换句话说,可以通过检查某个应该存在的方法是否有效,来决定是否需要初 ...

  5. PHP文件管理—实现网盘以及压缩包的功能操作

    代码如下: 1.主页面file_zip.php <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

  6. blender 操作快捷键

    选择:a: 全选OR取消选择b: 矩形选择c: 画刷选择ctrl+左键:套索选择ctrl+alt+右键 : 环边选择ctrl+右键:ctrl+tab:切换 点,线,面 选择模式ctrl+- 选择/收缩 ...

  7. 数据库截取字符串SUBSTR函数的使用

    背景 今天中午做需求的时候,有类似于根据银行卡卡号的前几位判断出是哪个银行的情况,每个银行需要截取的位数都不一样,这时我就想到了SUBSTR 数据库截取字符串SUBSTR函数的使用 假设有一个表的结构 ...

  8. java包装类型的坑

    开发中有遇到Long类型比较是否相等,比如Long A和Long B判断是否相等,当时习惯性的直接A==B: 自测的话确实么有问题,但是测试那边测试就有问题,当时郁闷了一下然后换成了A.equals( ...

  9. Shiro入门 - 通过自定义Realm连数数据库进行授权

    shiro-realm.ini [main] #自定义Realm myRealm=test.shiro.MyRealm #将myRealm设置到securityManager,相当于Spring中的注 ...

  10. lateinit 的使用限制

    呢?使用lateinit关键字 lateinit var test:String //正确lateinit val test:String //错误lateinit var test:Float // ...