如果一个块元素包含另一个块元素,将其更改为内联 CSS 是否错误?

2023-12-05

我知道将块元素放在内联元素中是错误的,但是下面的呢?

想象一下这个有效的标记:

<div><p>This is a paragraph</p></div>

现在添加这个CSS:

div {
   display:inline;
}

这会造成内联元素包含块元素的情况(div 变为内联,p 默认为块)

页面元素仍然有效吗?

在应用 CSS 规则之前或之后,我们如何以及何时判断 HTML 是否有效?

UPDATE:从那以后我了解到,在 HTML5 中,将块级元素放入链接标记内是完全有效的,例如:

<a href="#">
      <h1>Heading</h1>
      <p>Paragraph.</p>
</a>

如果您希望将一大块 HTML 作为链接,这实际上非常有用。


来自CSS 2.1 规范:

当内联框包含流内块级框时,内联框(及其在同一行框中的内联祖先)将在块级框(以及任何连续或仅由可折叠的空白和/或外流元素),将内联框分成两个框(即使任一侧为空),块级框的每一侧各一个。分隔符之前和分隔符之后的行框包含在匿名块框内,并且块级框成为这些匿名框的同级框。当这样的行内框受到相对定位的影响时,任何产生的平移也会影响行内框中包含的块级框。

如果满足以下规则,则该模型将适用于以下示例:

p    { display: inline }
span { display: block }

与此 HTML 文档一起使用:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HEAD>
  <TITLE>Anonymous text interrupted by a block</TITLE>
</HEAD>
  <BODY>
    <P>
      This is anonymous text before the SPAN.
      <SPAN>This is the content of SPAN.</SPAN>
      This is anonymous text after the SPAN.
    </P>
  </BODY>

P 元素包含一个匿名文本块 (C1),后跟一个块级元素,然后是另一个匿名文本块 (C2)。生成的框将是代表 BODY 的块框,包含 C1 周围的匿名块框、SPAN 块框和 C2 周围的另一个匿名块框。

匿名框的属性继承自封闭的非匿名框(例如,在标题“匿名块框”下面的示例中,即 DIV 的框)。非继承属性有其初始值。例如,匿名框的字体继承自DIV,但边距将为0。

在导致生成匿名块框的元素上设置的属性仍然适用于该元素的框和内容。例如,如果在上例中为 P 元素设置了边框,则边框将围绕 C1(在行尾打开)和 C2(在行首打开)绘制。

一些用户代理以其他方式在包含块的内联上实现边框,例如,通过将此类嵌套块包装在“匿名行框”内,从而在此类框周围绘制内联边框。由于 CSS1 和 CSS2 没有定义此行为,因此仅 CSS1 和仅 CSS2 用户代理可以实现此替代模型,并且仍然声明​​符合 CSS 2.1 的这一部分。这不适用于本规范发布后开发的UA。

随你所欲。显然,该行为是在 CSS 中指定的,尽管尚不清楚它是否涵盖所有情况,或者是否在当今的浏览器中一致实现。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如果一个块元素包含另一个块元素,将其更改为内联 CSS 是否错误? 的相关文章

随机推荐

  • 文化特定数据注释

    我正在尝试获取特定于文化的数据注释 DisplayFormat DataFormatString 0 d public DateTime Date get set 我认为这会起作用 因此 在美国 它会显示 DD MM yyyy 在欧洲 它会
  • Snow Leopard、Django 和 PIL 的问题

    自从升级到 Snow Leopard 以来 我在让 Django 和 PIL 正常工作时遇到了一些问题 我已经安装了 freetype libjpeg 和 PIL 它告诉我 TKINTER support ok JPEG support o
  • 在 kotlin lambda 内部返回时“此处不允许返回”

    我使用 lambda 来处理异步调用的回调 我想在调用方法之外定义回调以避免使用庞大的方法 但我似乎无法在 lambda 中使用早期返回 这使得代码不必要地难以阅读 我尝试将 lambda 定义为变量 但 return 在 lambda 内
  • Promise 的动态顺序执行

    我有需要按顺序运行的动态数量的承诺 我了解如何按顺序运行承诺 但我无法成功地使其与许多可能变化的承诺保持动态 这是我发现静态执行此操作的一种方法如何兑现一个又一个的承诺 function waitFor timeout return new
  • Python实时绘制ROS数据

    我正在尝试使用 python 绘制传入计算机的实时数据 数据来自 ROS 主题 我使用 rospy 订阅该主题以获取数据 这是我写的代码 import rospy from sensor msgs msg import ChannelFlo
  • 如何使我的所有网址都无扩展名,且不带尾部斜杠。并将 .php 和尾部斜杠重定向为无?

    我想让我的所有网址统一干净 这意味着我所有的 URL 都没有扩展名 也没有尾部斜线 并且如果一个人确实输入了 php或尾部斜杠 它只会将用户重定向到干净的 URL Example example com blog file php and
  • 如何对 UTF-8 字符使用 String 方法?

    如何对 UTF 8 字符使用 String 方法 例如 我有一个带有西里尔字符的字符串 所以当我使用string upcase它不起作用 Ruby 仅支持字母的大小写转换A Z and a z 原因很简单 其他字母的大小写转换没有明确定义
  • Resteasy 客户端的自定义 Jackson 序列化器

    是否可以为 Resteasy 客户端注册自定义 Jackson JSON 序列化器 我尝试过做类似的事情 ResteasyClient client new ResteasyClientBuilder register new Custom
  • 为什么没有更多的迭代器随机访问?

    我正在尝试了解有关 C 中的 STL 迭代器的更多信息 我理解不同的数据结构如何具有不同的迭代器 但我不明白为什么有些迭代器不是随机访问 例如 为什么 LinkedList 迭代器不是随机访问迭代器 我知道 LinkedList 本身并不是
  • 汇编 (,%eax,4)

    如果我的命令行之一显示 jmp 0x804a180 eax 4 这意味着什么 我特别询问是因为第一个逗号之前没有值 而且我不确定地址之前的 到底是什么意思 该指令跳转到其值位于计算得出的地址处的位置 eax 4 0x804a180 The
  • C# 调用一个 DLL 函数,该函数返回一个指向结构数组的指针

    我尝试了各种方法的许多不同组合来封送此调用 这是一个 DLL 它返回一个指向结构数组的指针 像 debugPort 这样的类型实际上是枚举 struct debugConnectParameters brief Get device cha
  • 从 PHP 脚本执行 shell 脚本

    我想从 PHP 脚本执行系统上存在的 Bash 脚本 我的系统上有两个脚本 其中之一是名为的 PHP 脚本client php目前在 var www html另一个是名为的 Bash 脚本testscript目前在 home testuse
  • Android的WebView.loadUrl方法中Url的长度有限制吗?

    我想将本地资源 传输 到从远程服务器加载的页面 我想做这样的事情 webView loadUrl http my server com page html webView loadUrl javascript function someLo
  • Perl:无法使用 SSL 访问 Web 服务

    这是我的第一个 Perl 脚本 我已经使用 CPAN 安装了 SOAP Lite 看起来一切顺利 我正在尝试访问一个简单的 HelloWorld NET Web 服务 我收到一个错误 该错误似乎与 Perl 或 SOAP Lite 无法验证
  • 在 WP7 中向 xml 文件添加元素?

    如何在 wp7 中向 xml 文件添加元素 我找到了很多资料显示如何在 ASP NET 浏览器上的 Silverlight 等中添加元素 但在 wp7 上却没有 我一直看到我们应该使用 XDocument XML to Linq 只是不知道
  • 这是什么意思?

    我正在分析一些 Python 代码 但我不知道是什么 pop population 方法 它是类似于Java中的数组列表还是二维数组 这是切片表示法的一个示例 它的作用取决于切片的类型population If population是一个列
  • 为什么“man bash”页面声明“declare”和“local”“-n”属性“不能应用于数组变量”,但它却可以?

    为什么local n当手册时处理数组变量明确表示不 说明书有错吗 这是否依赖于某种 bash 未定义的行为 说明书已经过时了吗 我错过了什么吗 以下是我从 bash 手册中查看的信息 Run man bash并搜索local 使用正则表达式
  • Spring 批处理:JdbcPagingItemReader 无法获取第 1 页以后的页面

    这是我的读者 Bean public ItemReader
  • mysql 使用 GROUP BY 进行数据透视查询结果

    我有一个数据表 我想将其导出为 CSV 理想情况下 我想交换行和列 以便数据更好地分组 进一步解释一下 目前 数据库看起来像这样 data id data timestamp data value 1 2011 07 07 00 01 00
  • 如果一个块元素包含另一个块元素,将其更改为内联 CSS 是否错误?

    我知道将块元素放在内联元素中是错误的 但是下面的呢 想象一下这个有效的标记 div p This is a paragraph p div 现在添加这个CSS div display inline 这会造成内联元素包含块元素的情况 div