块、行内、行内块

最新推荐文章于 2023-06-25 16:46:28 发布
最新推荐文章于 2023-06-25 16:46:28 发布
阅读量2.9k 收藏 12
点赞数 6
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yangguo52047/article/details/107428071
版权

文章目录

一、块元素block

  • 块元素——div、p、h1-h6、ul、ol、li
  • 所有的块级元素独占一行显示
  • 可以设置宽高

二、行内元素inline

  • 行内元素——span、a、font、strong、em、i
  • 所有的行内元素都在一行上显示
  • 不能设置宽高、由内容撑开

三、行内块inline-block

  • 行内块——img、input
  • 可以设置宽高、并且在一行上显示
  • 默认对齐的是基线
孤风雪影
关注
  • 6
    点赞
  • 踩
  • 12
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
行、块、行内块标签
咔秃噜儿皮儿的博客
05-24 418
HTML的俩类标签：行标签、块标签 前言：        我发现一直以来，我进入了一个误区，我对于行标签和块标签首先定义就搞错了
行内元素、块元素都有哪些
09-22
将display设为`inline`可以使块级元素变为行内元素，而设为`block`则可使行内元素变为块级元素。此外，还有`inline-block`值，它结合了两者特性，元素像块级元素一样可以设置宽高和margin，但仍然可以与其他元素并列...
【HTML5-小知识】块元素、行内元素和行内块元素
luckyboy!的博客
08-14 4593
HTML常用标签掌握之后，应当进一步了解元素的三种类型，块元素，行内元素，行内块元素，掌握这三种元素类型的特点。以上就是今天要讲的全部内容，本文仅仅介绍了HTML中标签元素的三种类型，块元素、行内元素、行内块元素的通途和特点。在使用标签对网页布局和对文本惊醒排版很重要。...
行内、行内块、块级
m0_50266714的博客
08-23 220
今天讲课的时候，讲到了html中的标签的显示模式，大致分为块级标签和行内标签。那么初学者在刚使用标签的时候会发现有些属性在一些标签上不起作用，比如宽、高、水平居中等，其实这个属性的使用只有在块级标签上使用才起作用。个人认为这个也是初学者非常容易忽略的地方，所以我就把它记下来！ 比如会有一种情况，给p标签水平居中有作用，但是给font加水平居中属性就没作用（如下）： 1.p{ color:red; text-align:center;}<br> 2.font{color:red; text-ali
行内，行内块，块级介绍
lihongen6的博客
08-23 990
** 一、块元素block div、p、h1-h6、form、ul、ol、dl、dt、dd、li、table、tr、td、th、hr、blockquote、address、table、menu、pre HTML5：header、section、article、footer等等 块级元素的特点 1.块级元素独占一行，当没有设置宽高时，它默认设置为100% 2.块级元素允许设置宽高，width、height、margin、padding、border都可控制 3.块级元素可以包行内元素、块级元素 （二）、行内元
块级，行内，行内块元素
小白girl
08-21 2863
显示模式（display）的几个属性： block-level（块级元素）： 常见标签： &lt;h1&gt;&lt;/h1&gt; &lt;h2&gt;&lt;/h2&gt; &lt;h3&gt;&lt;/h3&gt; &lt;h4&gt;&lt;/h4&gt; &lt;h5&gt;&lt;/h5&gt; &lt;h6&g
行内和块元素
04-18
二、行内元素和块元素详细有哪些 内联元素（行内元素）包括：a（锚点）、abbr（缩写）、acronym（首字）、b（粗体）、bdo（bidioverride）、big（大字体）、br（换行）、cite（引用）、code（计算机代码）、dfn...
浅谈html标签的显示模式(块级标签,行内标签,行内块标签)
09-28
2. **宽高可设**：可以设置宽度和高度，这使得行内块元素能更好地适应布局需求。 在实际应用中，可以通过CSS的`display`属性来改变元素的显示模式。例如： 1. **块级转行内**：`display: inline;` 2. **行内转块级*...
工程师必知必会盒模型与块状行内元素.docx
10-23
**控制块级元素与行内元素的方法**： - 通过改变`display`属性来转换元素类型。例如，可以将一个行内元素转换为块级元素，或者反之亦然。 - 使用`float`属性可以让块级元素像行内元素那样显示在同一行，而使用`clear...
块元素、行内元素、行内块元素
Matcha_ice_cream的博客
01-10 1723
块、行内、行内块元素1. 块元素2. 行内元素3. 行内块元素4. 块、行内、行内块元素演示：5. 元素显示模式转换 1. 块元素 （1）常见的块元素有： div、h1~h6(标题标签)、p(段落标签)、ul、ol、li （2）块元素的特点： 1、独占一行 2、宽度默认是父级元素的宽度（100%） 3、宽度、高度、内外边距都是可以改变的 4、块级元素里面也可以放行内、块、或者行内块元素 2. 行内元素 （1）行内元素有： a、span、strong/b、em/i、del/s、ins/u （2）行内元素的特点
display:flex布局，自动适应屏幕高度100%
热门推荐
web前端开发大全
02-28 2万+
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &l
行内、行内块、块级的区别
qq_45032146的博客
08-23 1721
一、块元素block div、p、h1-h6、form、ul、ol、dl、dt、dd、li、table、tr、td、th、hr、blockquote、address、table、menu、pre HTML5：header、section、article、footer等等 块级元素的特点 1.块级元素独占一行，当没有设置宽高时，它默认设置为100% 2.块级元素允许设置宽高，width、height、margin、padding、border都可控制 3.块级元素可以包行内元素、块级元素 （二）、行内元素in
html-元素显示模式：块、行内、行内块
weixin_48645846的博客
03-16 156
display：inline-block 转换为行内块元素。常见的元素显示模式有三种：块级元素、行内元素、行内块元素。display：block 转换为块级元素。display：inline 转换为行内元素。常见的元素显示模式有哪些、如何区分、如何转换？
行内元素，行内块元素，块元素的区别
小杨的博客
06-19 2618
行内元素，行内块元素，块元素的区别，行内元素，行内块元素，块元素的转换display
行级，块级，行内块
weixin_72686458的博客
07-21 164
1、块级元素特性总结 没有设置宽高的时候，宽继承父元素的宽度，高度由内容撑开 默认独立成行——默认垂直布局 具有盒模型特征（默认可以设置宽度、高度、padding、margin、border）可以设置上下左右的内边距和外边距。 2、行内（行级）元素特性总结 宽度默认由内容撑开 高度默认由内容撑开 默认横向显示——默认水平布局，相邻的行级元素会在同一行显示，直到一行排不下，才会换行 换行和空格会被解析 不能设置宽高 只能设置左右的外边距，不能设置上下的外边距 可以设置上下左右的内边距和边框。 行内元素只能容纳
行内元素、块级元素、行内块元素
weixin_44167504的博客
09-14 105
行内元素、块级元素、行内块元素 块属性:自己独自霸占一整行,默认宽度是100%,可以设置宽高（div、p、h1-h6、form、ul、ol、dl、dt、dd、li、table、tr、td、th、hr、blockquote、address、table、menu、pre、 HTML5：header、section、article、footer等等） 行内:可以与别人共处一行,不可以设置宽高,其宽高由内容给撑开（span、a、string、i、pre） 行内块:可以设置宽高，可以共处一行（img 、i
块元素、行内元素和行内块元素
Liyunhao_haoge的博客
10-05 759
块元素、行内元素和行内块元素块级元素(block-level) 每个块元素通常都会独自占据一整行或多整行，可以对其设置宽度、高度、对齐等属性，常用于网页布局和网页结构的搭建； 常见的块元素有h1-h6,p,div,ul,ol,li等，其中div标签是最典型的块元素。 特点：1）总是从新行开始 2）高度，行高，外边距以及内边距都可以控制 3）宽度默认是容器的100% 4）可以容纳内联元素和其他块元素...
块级元素、行内元素、行内块元素的区别
m0_59717262的博客
06-25 4232
不管块级元素还是行内元素，区别:一是排列方式，二是宽高边距设置，三是默认宽度。块级元素会独占一行，而行内元素和行内块元素则会在一行内显示；块级元素和行内块元素可设置 width、height 属性，而行内元素设置无效；块级元素的 width 默认为 100%，而行内元素则是根据其自身的内容或子元素来决定其宽度；而行内块级元素又同时拥有块级元素和行内元素的特点。
layui设置行内块
最新发布
06-05
在layui中，可以使用内联样式和类来设置行内块。以下是使用内联样式设置行内块的代码示例： ```html <div style="display:inline-block;">这是一个行内块元素</div> ``` 如果您希望在多个元素中使用行内块样式，可以使用类来设置。以下是使用类设置行内块的代码示例： ```html <div class="inline-block">这是一个行内块元素</div> ``` ```css .inline-block { display: inline-block; } ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值