块级元素，简单来说，就是自己独占一行的元素。其特点：

　　①总是在新行上开始；
　　②高度，行高以及外边距和内边距都可控制；
　　③宽度缺省是它的容器的100%，除非设定一个宽度。
　　④它可以容纳内联元素和其他块元素
汇总代码如下：

 <!doctype html>
 <html>
 <head>
     <meta charset="UTF-8">
     <title>Document</title>
 </head>
 <body>
     <!-- 块状元素 独占一行 -->

     <!-- div无语义,称它为盒子 -->
     <div>盒子</div>

     <!-- h1-h6语义 定义标题 -->
     <h1>标题1</h1>
     <h2>标题2</h2>
     <h6>标题3</h6>

     <!-- p 语义 段落标签 写文字-->
     <p>文章</p>

     <!-- 列表多数用来存一系列的相似的数据 -->
     <!-- 有序列表 -->
     <ol>
         <li>导航1</li>
         <li>导航2</li>
         <li>导航3</li>
     </ol>
     <!-- 无序列表 -->
     <ul>
         <li>导航1</li>
         <li>导航2</li>
         <li>导航3</li>
     </ul>
     <!-- 定义列表 解释某个名词 -->
     <dl>
         <dt>名词</dt>
         <dd>解释名词的位置</dd>
     </dl>

     <!-- 表格 渲染性能不好 少用 -->
     <table>
         <caption>表格头部</caption>
         <!-- tr是行 -->
         <tr>
             <!-- th表头 -->
             <th>星期一</th>
             <th>星期二</th>
         </tr>
         <tr>
             <!-- td单元格 -->
             <td>上课</td>
             <td>上课</td>
         </tr>
     </table>
 </body>
 </html>

HTML块级标签汇总（小篇）的更多相关文章

  1. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  2. python全栈开发day39-CSS继承性和层叠性、权重问题、盒模型和其属性、文本级标签和块级标签、浮动

    一.上次内容回顾 1.CSS的三种引入方式: 行内式 内接式 外接式 链接式 导入式 2.基础选择器和高级选择器 1)标签选择器 p{} 2)  id选择器 #nva{} 3) 类选择器 .nva{} ...

  3. HTML开发之（块级标签，行内标签，行内块标签）

    显示模式的特性: 主要分为两大类: 块级元素:独占一行,对宽高的属性值生效:如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽: 行内元素:可以多个标签存在一行,对宽高属性值不生效,完全靠内 ...

  4. HTML基础知识（块级标签，行内标签，行内块标签）

    块级元素:独占一行,对宽高的属性值生效:如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽: 行内元素:可以多个标签存在一行,对宽高属性值不生效,完全靠内容撑开宽高! 其中还有一种结合两种模 ...

  5. CSS(3)---块级标签、行内标签、行内块标签

    块级标签.行内标签.行内块标签 html中的标签元素三种类型:块级标签.行内标签.行内块标签. 一.概述 1.块级标签 概念 每个块元素通常都会独自占据一整行或多整行,可以对其设置宽度.高度.对齐等属 ...

  6. 块级标签包含行内标签底部出现3px间隔的解决办法

    当块级标签(如div)内包含了行内标签(如img),则外层元素与内层元素底部会出现3px的间隔: 代码如下: <!doctype html> <html lang="en& ...

  7. HTML学习笔记——块级标签、行级标签、图片标签

    1>块级标签.行级标签 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  8. html之块级标签h系列,div

    两个名词含义: 块级标签:内容再少也会占满整行 内联标签:有多少内容点多少地方 注:块级标签和内联不签不是绝对的,可以通过CSS作任意转换 1.h1-h6 :块级标签 请仅仅把标题标签用作标题文本,如 ...

  9. css块级标签、行内标签、行内块级标签

    <html><head lang="en"> <meta charset="UTF-8"> <title>< ...

随机推荐

  1. Visulalization Voronoi in OpenSceneGraph

    Visulalization Voronoi in OpenSceneGraph eryar@163.com Abstract. In mathematics a Voronoi diagram is ...

  2. 前端学PHP之变量范围

    × 目录 [1]范围跨度 [2]函数范围 [3]global[4]预定义变量[5]超全局变量 前面的话 变量范围即它定义的上下文背景(也就是它的生效范围).在javascript中,并没有变量范围这一 ...

  3. 被嫌弃的eval和with

    × 目录 [1]eval [2]with 前面的话 eval和with经常被嫌弃,好像它们的存在就是错误.在CSS中,表格被嫌弃,在网页中只是用表格来展示数据,而不是做布局,都可能被斥为不规范,矫枉过 ...

  4. RHEL 6.3 详细安装教程

    以前刚接触linux时,什么都不懂,为了学习,在电脑上安装双系统(原系统为Win7),吃过不少苦头,在网上搜教程,很多都是语焉不详,导致安装过程中战战兢兢.最近朋友面试运维,面试官有考他对linux安 ...

  5. JavaScript使用构造函数获取变量的类型名

    在JavaScript中,如何准确获取变量的类型名是一个经常使用的问题. 但是常常不能获取到变量的精确名称,或者必须使用jQuery 中的方法,这里 我通过 typeof ,jQuery.type 和 ...

  6. ubuntu 配置git公钥

    Git是分布式的代码管理工具,远程的代码管理是基于SSH的,所以要使用远程的Git则需要SSH的配置. github的SSH配置如下: 一 . 设置Git的user name和email: $ git ...

  7. ORA-00257 archiver error 处理思路

    1.首先查下oerr给出的简要说明 2.查询V$RECOVERY_AREA_USAGE信息 3.根据实际空间剩余情况先适当增加归档目录的大小,保证先恢复业务 4.查看备份是否存在问题 1.首先查下oe ...

  8. DocX在C#中的基本操作方法

    用了一个星期把园子里2016年中有关.net的文章都看了,有些只是大致的看了一下,在看的同时也在记录一些通用的方法.发现有很多对NPOI的文档,主要是操作Excl的方法,却很少有关文档类型的方法. 在 ...

  9. Javascript数组常用方法

    一.forEach对数组的遍历 二.map返回经过运算的新数组 三.filter返回满足条件的新数组 四.返回数组前后元素运算的结果 五.every遍历数组每项元素是否满足某个条件,全部满足返回tru ...

  10. 1.Java网络编程之概述

    黑马程序员_毕向东_Java基础视频教程第23天-01-网络编程(概述)学习笔记 网络通讯三要素: 1.IP地址 I.网络中设备的标识  II.不易记忆,可用主机名 www 万维网组织,baidu主机 ...