块元素，内联元素，内联块标签的划分及相互转化和嵌套

最新推荐文章于 2021-06-10 11:29:52 发布
最新推荐文章于 2021-06-10 11:29:52 发布
阅读量1k 收藏
点赞数 2
分类专栏： HTML、CSS 文章标签： 标签 前端 HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zpw91/article/details/53355660
版权
本文详细介绍了HTML中块元素、内联元素和内联块元素的特性、常见标签及其相互转化。块元素如div、h1~h6、p等占据整行，支持设置宽高；内联元素如span、a、em等在同一行显示，不支持宽高；内联块元素如img支持设置宽高并能同行显示。此外，还探讨了标签的嵌套规则和前端规范，以及选择器的使用原则。
摘要由CSDN通过智能技术生成

标签的划分

  • 1.1单标签

  • 1.2双标签

  • 2.1块元素标签

  • 2.2内联元素标签-行元素
  • 内联块元素标签

块元素标签

##块元素标签常见标签
- 基本元素

  • div
    • 双
    • 语义：无意义
  • h1~h6
    • 双
    • 语义：一级标题 至 六级标题
  • p
    • 双
    • 语义：段落
      -语义相关元素

  • blockquote

    • 双
    • 语义：定义一段长的引用文本 , 浏览器会以缩进的形势进行展示
    • 属性：cite
    • 标明引用文章出自哪里
    • 里面填写的是引用文章的URL

  • address

    • 双

    • 语义：定义一个地址 , 浏览器会以斜体的形式进行展示

    • 列表相关元素

  • ul
    • 双
    • 语义：无序列表
  • ol
    • 双
    • 语义：有序列表
  • li
    • 双
    • 语义：列表项
    • 注意：li 必须配合 ol 或者 ul 去使用，不能单独使用
  • dl
    • 双
    • 语义
最低0.47元/天 解锁文章
策码扬鞭
关注
专栏目录
高效编程：我们应该了解哪些编译器优化技术？如何做出成熟的优化行为，掌握C++编程中的编译器优化艺术。
探索C++编程的奥秘，分享深入的技术见解和实践，旨在激发读者创造力与解决问题的思维。
11-18 426
编译器优化（Compiler Optimization）不仅仅是对代码的简单改进，它是一种艺术，一种在有限的资源下追求极致性能的艺术。每当我们编写C++代码时，我们实际上是在与编译器进行一场无声的对话，试图告诉它如何更有效地将我们的思想转化为机器语言。
《ClickHouse企业级应用：入门、进阶与实战》1 全面了解ClickHouse
最新发布
AI天才研究院
01-31 1万+
近年来，ClickHouse发展势头迅猛，社区、大厂纷纷跟进使用。面对万亿级的数据查询分析也能做到亚秒级响应。那么，ClickHouse 到底是何方神圣？为什么如此受青睐？各位看官，欲知 ClickHouse 为何方神圣，且往下看。本章我们先来了解什么是ClickHouse，内容包括ClickHouse是什么，它具有哪些特性，适用哪些应用场景等。1.1 ClickHouse 概述本节介绍 ClickHouse 是什么、发展历程，以及ClickHouse在 OLAP 生态中的位置。同时，简单介绍了 OLAP
五、标签相互转换、内联块标签垂直对齐方式、溢出内容的处理、伪元素、浮动
qq_52426181的博客
11-27 187
一、标签相互转换 1.标签分类 （1） 块标签 特点： 默认宽度100%，独占一行，可设左右样式 div h1-h6 p hr table caption tr thead tbody tfoot ul li ol dl dt dd （2）内联标签 特点：默认宽度由内容撑开，多个标签在一行显示，部分样式无效（宽高，上下内外边距） span strong b em i a br del sub sup （3）内联块标签 特点：
html标签——内联标签(行内元素)
dhx36675的博客
09-18 1810
阅读目录 字体 粗体 斜体 上下标 划线 b em sup del strong i sub u 排版 span br 超链接 a 图片 img 回到顶部 字体标签 粗体标签<b>或<strong>(已废弃) 示例： 娃哈哈 <b>娃哈哈</b> <str...
元素，内联元素，块级元素，标签，列表
weixin_37150764的博客
10-15 123
内联元素 inline element 不独占一行，无法定义宽高 <strong style="background-color: blue;">123</strong> strong em del ins span label a sub sup 块级元素 block element 独占一行，可以定义宽高 p hx div address legend fieldset ul ol li dl dt dd table form 内联块级元素 ..
块级标签和内联标签
weixin_inhsoft6的博客
12-12 392
块级标签： 内联标签： block（块）元素的特点 ① 总是在新行上开始； ② 高度，行高以及外边距和内边距都可控制； ③ 宽度缺省是它的容器的100%，除非设定一个宽度。 ④ 它可以容纳内联元素和其他块元素 inline（内联）元素的特点 ① 和其他元素都在一行上； ② 高，行高及外边距和内边距不可改变； ③ 宽度就是它的文字或图片的宽度，不可改变 ④ 内联元素只能容纳文本或者其他内联元素 对行...
在html中p标记可以嵌套p标记,html P标签为什么不能嵌套div？还有关于html P标签的css样式的实例介绍...
weixin_28795851的博客
06-10 1769
本篇文章介绍了有关于html p标签的进阶版，上一篇基础版没看过的同学点击下方的链接就可以看了，本篇主要介绍了html p标签的两个重要知识点，一个是如何用css的样式来控制P标签的具体使用，每个都有实例，有兴趣的同学可以自己敲代码试试，还有一个是html P标签为什么不能嵌套div的详解，希望各位认真阅读html P标签标签定义及使用说明： 标签定义段落。元素会自动在其前后创建一些空白。浏览器会...
元素类型
qq_46397944的博客
03-27 485
元素类型及转化 html将元素分为空标记（单标记）、常规标记（双标记） css是如何划分元素的呢，如下： 一、元素类型的分类 两种分法： 1.块状元素 内联元素（行内元素） 可变元素 注：这种分法将内联块（行内块）元素分到了内联元素这一大类中 可变元素：根据上下文的关系决定当前元素类型是块元素还是行内元素特列button 2.块元素 内联元素 内联块元素 两者争议点在于内联块元素是属于单独的一...
html内联块标签有那些,HTML常用标签-<body>内基本标签（块级标签和内联标签）
weixin_31995337的博客
06-08 287
HTML&CSS基础-背景的简写属性作者：尹正杰版权声明：原创作品，谢绝转载！否则将追究法律责任。一.HTML源代码背景的简写属性body{height: 5000px;/*设置一个颜色*//*background-color: deeppink;*//*设置一个图片背景*//*background-image: url(img/02.png);*//*设置背景图片不重复*//*backg...
块级标签与内联标签
yp320645的博客
07-12 511
7.标签总结 块级标签，在新的一行进行显示 Div、h1-h6、 p、 hr、table、ul、ol、dl、tr、option、dd、dl 内联标签：不会新起一行显示 Img、input、a、td、textarea、span、label、select、th、button...                                                        
内联标签和块标签
code weaver的专栏
11-09 671
内联标签：img,span ①同一类型标签并排显示 ②宽度由内容撑开 ③不支持宽高(除img标签) ④不支持margin,padding 块标签：p,div,ol,ul,li
块状元素居中、元素分类（块状，内联，内联块状）、内联转块状
aomichen2432的博客
08-08 129
块状元素中的文字、图片居中显示： CSS设置：text-align:center <style type="text/css"> div{text-align:center;} </style> </head> <body> <div><img src="http://img.mukewang.com/5...
html中内联元素排列对齐原理,html标签中的内联元素（行内元素）详解
weixin_39832965的博客
05-31 1170
html内联元素，也叫行内元素，相邻的多个内联元素是水平横向排列显示在同一行，其宽度随内容的变化而变化，在同一行显示多个内容，就可以使用内联元素来实现，这样就不需要将块级元素设置为浮动或绝对定位也能在一行水平横向排列内容了。内联元素的概念内联元素，是一类前后没有换行符，且相邻前后的元素都在同一行中显示，他们是从左至右有序的排列在一行，所以，每个内联元素不会单独占据一行，内联元素，还有行内元素，内嵌...
块级元素 内联元素嵌套规则
A2268320026的专栏
04-27 554
1.内联不能嵌套块级，块级可以嵌套内联元素 2.几个特殊的块级元素只能包含内联元素，不能再包含块级元素。特殊标签是：h1~h6,p,dt 3.li可以嵌套div 4.块级元素与块级元素并列，内联元素与内联元素并列。块级不可以和内联并列
在html中怎么设置内联标签,HTML中内联元素有哪些
weixin_39823200的博客
06-09 1332
内联元素有：a、acronym、b、br、cite、code、dfn、em、font、i、img、input、kbd、label、s、samp、small、span、strong、sub、sup、textarea、u、var、strike。本教程操作环境：Windows7系统、HTML5版本、Dell G3电脑。相关教程推荐：html教程内联元素(html规范中的概念)英文：inline elem...
HTML全标签分类块级内联内联块
front_endxiaobaia的博客
03-29 276
- -注释： 标签分类查询文档，不涉及如何使用 部分标签由于非常不兼容主流浏览器未注明 标签参照W3C 数据采集使用Firefox 74.0(64位)版本 1.块级元素-- block ···特点： ······独占一行； ······不设置宽度时与父容器相同； ······支持所有样式； 具体： html div p body form ul ...
HTML中哪些是块状元素，哪些是内联元素？
热门推荐
WebLogic
01-03 1万+
常见的块状元素与内联元素 块状元素 内联元素 address – 地址 blockquote – 块引用 center – 居中对齐 dir – 目录列表 div – 常用块级容易，也是CSS layout的主要标签 dl – 定义列表 fieldset – form控制组 form – 交互表单
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值