一.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. SQL Server进阶（十一）存储过程

    存储过程和函数的区别 存储过程是第一次编译之后就会被存储的下来的预编译对象,之后无论何时调用它都会去执行已经编译好的代码.而函数每次执行都需要编译一次.总结下来有下面几个区别: 基本不同: 函数必须有 ...

  2. SqlExpress与 LocalDB的链接字符串转换

    1.如果是连接SQL Server Express databases,需要将连接字符串定义为:Data Source=.SQLEXPRESS" to "Data Source=( ...

  3. 1、PHP入门二维数组与循环

    <?php $two=array(array(2,3),1=>array(1,2,3),2=>array(4,5,6)); echo $two[1][0];//输出1 echo $t ...

  4. 苹果手机上点击WEUI日期控件不容易点中

    主要问题是WEUI cells有Padding,而苹果手机一般屏幕较小,容易点不中导致的 <div class='weui_cell' style="padding-bottom:0p ...

  5. spring注解第03课 按条件加载Bean @Conditional

    package com.atguigu.config; import org.springframework.context.annotation.Bean; import org.springfra ...

  6. 使用Verilog HDL语言注意事项

    1.wire和reg区别,输入输出是wire型,表示硬件线的连接,要在always模块里被赋值需要中间reg型变量,两者通过: assign 输入/输出=reg型中间变量 2.case的default ...

  7. solr 中文分词器IKAnalyzer和拼音分词器pinyin

    solr分词过程: Solr Admin中,选择Analysis,在FieldType中,选择text_en 左边框输入 “冬天到了天气冷了小明不想上学去了”,点击右边的按钮,发现对每个字都进行分词. ...

  8. c++ virtual 记录

    虚继承: http://zh.wikipedia.org/wiki/%E8%99%9A%E7%BB%A7%E6%89%BF 解决了菱形继承问题 cB cC 继承cA    cD继承cB,cC    c ...

  9. ThinkPHP5基础学习

    一.目录与文件结构 二.控制器 三.数据库 四.模型 五.模板

  10. Django REST Framework API Guide 04

    本节大纲 1.serializers 1.Serializers Serializers允许复杂的数据,像queryset和模型实例转换成源生的Python数据类型.从而可以更简单的被渲染成JSON, ...