样式方面的
或填充/边距元素

2024-03-12

现在有了 HTML5 和 CSS3,就是使用<br>当可以使用边距/填充时标签会皱起眉头?

编辑:这是关于我的用例的 div 元素之间的间距,但也欢迎一般最佳实践建议。


实际上,关于它的使用有相当明确的规则,可以追溯到HTML 2.0 https://www.rfc-editor.org/rfc/rfc1866.txt首次推出时:

The <BR>元素指定单词之间的换行符(请参阅第 6 部分“字符、单词和段落”)。例如:

<P> Pease porridge hot<BR>
Pease porridge cold<BR>
Pease porridge in the pot<BR>
Nine days old.

The <br>元素本身从来没有打算用于控制边距/填充。尽管他们引入了演示clearHTML 3.2 的属性来处理浮动图像之类的事情,但它很快在 HTML 4 和 XHTML 1 中被弃用,取而代之的是 CSS。那是差不多15年前的事了,所以这确实不是什么新鲜事。

In HTML5 http://www.w3.org/TR/html5/text-level-semantics.html#the-br-element,他们已经说得更清楚了<br>不适用于演示或布局,带有示例(和the clear属性已过时 http://www.w3.org/TR/html-markup/br.html#br-constraints):

br元素只能用于实际上是内容一部分的换行符,例如诗歌或地址中的换行符。

下面的例子是正确的用法br元素:

<p>P. Sherman<br>
42 Wallaby Way<br>
Sydney</p>

br元素不得用于分隔段落中的主题组。

以下示例不符合规定,因为它们滥用了br元素:

<p><a ...>34 comments.</a><br>
<a ...>Add a comment.</a></p>
<p><label>Name: <input name="name"></label><br>
<label>Address: <input name="address"></label></p>

以下是上述内容的替代方案,它们是正确的:

<p><a ...>34 comments.</a></p>
<p><a ...>Add a comment.</a></p>

<p><label>Name: <input name="name"></label></p>
<p><label>Address: <input name="address"></label></p>

所以使用<br>为了布局目的而使用 CSS 边距来代替 CSS 边距一直是不受欢迎的,至少对于编写规范的人来说是这样。

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

样式方面的
或填充/边距元素 的相关文章

  • 用 Beautiful Soup 进行抓取:为什么 get_text 方法不返回该元素的文本?

    最近我一直在用 python 开发一个项目 其中涉及抓取一些网站的一些代理 我遇到的问题是 当我尝试抓取某个知名代理站点时 当我要求 Beautiful Soup 查找 IP 在代理表中的位置时 它并没有按照我的预期执行操作 我将尝试查找每
  • 绝对定位的表头 (th) - 哪个浏览器是错误的?

    这个带有一个绝对定位列的简单表格在 Firefox 和 IE 中的呈现方式与在 Chrome 和其他基于 Webkit 的浏览器 中的呈现方式不同 http jsfiddle net WZ6x8 http jsfiddle net WZ6x
  • CSS 中的边框图像开头

    MDN 是这样定义的边框图像开始 https developer mozilla org en docs Web CSS border image outset border image outset 属性描述了边框的数量 图像区域超出边框
  • Img srcset 和尺寸属性

    我正在尝试制作一个简单的网站img标签 将使用新的srcset属性 主要思想是根据屏幕分辨率更改图像 src 工作示例 http pixelteam pl surprise some files index html 问题在于sizes 正
  • 横向旋转到纵向时的字体大小怪异 - CSS 媒体查询 - iPhone5 Safari

    我已经用谷歌搜索了这个 但无法弄清楚 谢谢你的帮助 Studiolynch com 响应式和流体布局 在 iphone 5 Safari 中完美运行 除了从横向模式旋转到纵向模式会使字体大小小于应有的大小 但是 如果您最初以纵向模式加载页面
  • 具有一个 css 类的堆叠图标

    在新的 FontAwesome 4 0 0 中 堆叠项目有 css 样式 span class fa stack i class fa fa square o fa stack 2x i i class fa fa twitter fa s
  • $(this) 在 jQuery 中如何工作

    jQuery 标签是如何实现的 this 到底工作吗 我知道如何使用它 但是 jQuery 如何知道哪个元素是 活动的 用于获取当前项目的原始 Javascript 标签是什么 还是只是 jQuery The this是一个简单的 java
  • jquery 文本旋转

    我在 div 中有一个简单的文本 如下所示 div div This is an example text div div 我希望 div 内的文本旋转 20 30 度 我已经找到了this https stackoverflow com
  • 用于创建动画渐变按钮背景的 CSS

    我正在寻找一个CSS规则可以创建一个CSS动画按钮的彩色渐变背景 https i stack imgur com NHqf8 gif 我只是想玩它并这样做 https codepen io prashant nadsoftdev pen b
  • Twitter Bootstrap - 多图像(缩略图)轮播 - 一次移动一个缩略图

    我正在尝试 Twitter bootstrap 3 我对 HTML CSS 和 Javascript 还很陌生 我有一个我创建的轮播 它的代码如下所示 div class container div class carousel slide
  • 获取画布上下文的最后一个点的坐标

    我想创建一个arrowTo功能与CanvasRenderingContext2D prototype 为此 我需要获取最后一个点的坐标 例如 var ctx someCanvas getContext 2d ctx moveTo 10 40
  • 如何在 Bootstrap 4 中垂直对齐?

    我试图在 Bootstrap 4 4 0 0 alpha 6 中将我的大屏幕的内容垂直对齐在中心 在 Mac 桌面上的 Chrome 和 Safari 中 这种情况发生得很好 但在我的 iOS 设备上则不然 文本仍然与顶部对齐 我强制大屏幕
  • 如何将 HTML 链接放入电子邮件正文中?

    我有一个可以发送邮件的应用程序 用 Java 实现 我想在邮件中放置一个 HTML 链接 但该链接显示为普通字母 而不是 HTML 链接 我怎样才能将 HTML 链接放入字符串中 我需要特殊字符吗 太感谢了 Update 大家好你们好 感谢
  • CSS:如何在模糊的背景上剪切文本?

    我想重新创建以下样式 我想出了以下内容 问题是剪切不会影响模糊滤镜 我不知道如何解决它 这是我的 HTML 代码 glass width 40 height 100 position absolute background rgba 255
  • CSS :hover 影响所有子 div

    我里面有一个父 div 和多个子 div 我希望这样 如果您将鼠标悬停在父 div 上 它会以不同的方式影响所有子 div 的悬停状态 即 一个 div 的文本带有下划线 另一个 div 的文本会更改颜色 并且保存图像的 div 使图像稍微
  • 阻止通过 GET 传递“提交”按钮值?

    我正在尝试通过 GET 传递表单信息 这很重要 这样人们就可以将表单选择中过滤后的数据发送给其他人 问题是 使用下面的代码 它不仅传递过滤器信息 还传递提交表单值 如下所示 index php month filter Feb year f
  • 简单的颜色变化

    我正在创建一个用户界面 用户可以在其中更改页面的颜色值 我想要的是获取分配给其背景颜色的值并将其变亮一定程度 我只是想获得一条亮点线 而不必每次都制作新图像 示例 用户将背景颜色设置为 ECECEC 现在我希望某个元素边框变成 F4F4F4
  • CSS calc() 是否可以得到负值?

    假设我们有一个位于视口中心的容器 centered margin 0 auto width 960px 在该容器内 我有另一个容器 其宽度需要为视口宽度的 100 我可以将边距设置为 widest margin 0 480px 例如 问题是
  • window.open 使用 css 样式

    我想设计我的 window open 目前 我的网页上有一些项目由于解析了某个类而打开 然后在新窗口中打开指定的文本 我想更改字体大小 字体和填充等 这是我的 JavaScript 代码
  • 文本溢出:省略号显示不同的字符

    我这里遇到了一些 CSS 问题 看这张图片 https www flickr com photos 125543025 N07 saved 1 在此图像中 我为文本 INTENSE TRAINING 添加了 CSS 样式 sample st

随机推荐

  • 位置侦听器从服务工作,但不是 IntentService

    我有一个应用程序 我试图定期获取用户位置并将其发送到服务器 我有一项服务附加到AlarmManager每分钟执行一次 用于测试 该服务正确找到用户位置并注销 GPS 坐标 一旦出现 GPS 锁定 我就会取消位置请求并停止服务 当我请求位置更
  • C++ 2D 曲面细分库?

    我有一些凸多边形存储为点的 STL 向量 或多或少 我想要镶嵌 http en wikipedia org wiki Tesselate它们非常快 最好分成大小相当均匀的块 并且没有 条子 我将用它来将一些物体分解成小碎片 有谁知道一个很好
  • 如何使用线程在java中暂停执行

    我以编程方式创建了一个向导 它包含 3 个面板 第二个是devicePane 第三个是detailsPane 第三个面板包含一个进度条 我希望我的程序启动一个功能process 显示第三个面板后 可以使用线程吗 else if Parser
  • HTML+CSS 中的不确定进度条

    我想创建一个不确定的HTML CSS进度条所以它看起来像 Vista 上的那个 source microsoft com http i msdn microsoft com dynimg IC121865 png 我想 水平调整进度条宽度
  • 在同一终端中同时运行多个命令

    I want to run a few commands each of which doesn t quit until Ctrl C is pressed Is there something I can run to run all
  • 客户愤怒,与未知的 DLL 依赖项作斗争

    我是一位为客户开发 C Windows 应用程序的单人秀 在过去的几个月里 我们一直遇到同样的问题 即客户计算机上缺少 DLL 依赖项 尽管我尽了最大努力 但问题仍然存在 我们收到了愤怒的电子邮件 我的老板和我老板的老板对我很生气 顾客也不
  • 如何在 Swift 中将*正数*转换为数字数组

    我想转换一个positive数字到相应的数字列表中 数字也应该是整数 转换时 例如 1024 它应该返回 1 0 2 4 在 Swift 4 1 或更高版本中 let number 1024 let digits String number
  • 部署时使 Google Cloud Function 的 Firebase 缓存失效

    我最近使用 Cloud Functions 和 Firebase Hosting 实现了 SSR 当 JS 包构建时 它会收到一个缓存突发后缀 main 1 js 在我的函数内部 我有以下代码段用于缓存云函数的结果 res set Cach
  • winapi 中子窗口编辑控件上的 WS_TABSTOP

    在我的 WinAPI 应用程序中 我的子窗口中有一系列编辑控件 我希望用户能够通过按 Tab 键前进并按 Shift Tab 键返回来在它们之间移动 但我似乎不知道如何使用WS TABSTOP与子窗口 我想要发生的是 当用户单击 Tab 键
  • 将 HTML 元素的引用传递给自定义挂钩

    假设我有一个自定义挂钩 我将使用它来将单击事件侦听器添加到 HTML 元素中 我创建参考const buttonRef useRef null 因此第一次渲染时的值为 null ref 值仅在渲染方法的final 中分配 此时我的自定义钩子
  • 最低权限的身份服务器无法在 Azure 上正常工作

    我正在尝试实现一个遵循 OAUTH2 OIDC 协议的架构 为了做到这一点 我为客户端提供了 STS Identity Server v3 ASP NET WebApi 和 ASP NET MVC 应用程序 我的目标是将 STS 和 RES
  • 如何获取目录中的目录列表,如 list.files(),但改为“list.dirs()”

    我能够使用list files 获取给定目录中的文件列表 但如果我想获取目录列表 我该怎么做 它是否就在我面前作为一个选项list files 另外 我使用的是 Windows 所以如果答案是使用某些 Linux unix 命令 那对我来说
  • 将 Python SIGINT 重置为默认信号处理程序

    版本信息 操作系统 Windows 7 Python版本3 3 5 下面是我正在玩的一小段测试代码 目的是忽略CTRL C在执行某些代码时按下 之后CTRL C行为将会恢复 import signal import time try mar
  • 为什么 32 位内核可以运行 64 位二进制文​​件?

    在我的 OS X 机器上 内核是 32 位二进制文 件 但它可以运行 64 位二进制文 件 这是如何运作的 cristi diciu file a out a out Mach O 64 bit executable x86 64 cris
  • 如何为用户/连接设置一些上下文变量

    我目前使用 Firebird SQL 作为我的共享软件的数据库后端 还想支持 PG 9 3 在 FB 中 我使用 set get context 来执行此操作 设置上下文 http www firebirdsql org refdocs l
  • 如何在 swift 中下载 Pdf 文件并在文件管理器中查找

    我已经使用下面的代码下载了 pdf 我能够在应用程序数据容器中找到该文件 但从应用程序数据容器中我的设备需要 Mac x 代码或 iTunes 等 我可以给出文档的不同路径或在 iPhone 文件中查找 pdf 的其他位置吗 我可以选择使用
  • vba 是在相等比较中被视为零的空值

    我试图跳过值为零或为空的记录 截至目前 我有以下代码可以明确检查两者 但我觉得第二次检查是多余的 但我想确认我是对的 以便我可以删除 IF 的第二部分 IF CellInValue RowInCrnt ColInCrnt 0 Or Cell
  • git 分支切换 Laravel 时发生 ReflectionException 类不存在

    因此 在决定创建此问题之前 我阅读了大约 100 篇有关此问题的帖子 这个问题实际上非常具体 并且 100 可重现 我创建了一个 git 分支 我们可以称之为storeUpdate 在这个分支中我创建了一个名为 app Http Contr
  • C++ 中的成员函数指针 for_each

    我正在为一个学校项目开发一个 C 小型虚拟机 它应该像 dc 命令一样工作 由输入输出元件 芯片组 CPU 和 RAM 组成 我目前正在研究芯片组 其中我实现了一个小的解析类 以便能够从标准输入或文件中获取一些 Asm 指令 然后将这些指令
  • 样式方面的
    或填充/边距元素

    现在有了 HTML5 和 CSS3 就是使用 br 当可以使用边距 填充时标签会皱起眉头 编辑 这是关于我的用例的 div 元素之间的间距 但也欢迎一般最佳实践建议 实际上 关于它的使用有相当明确的规则 可以追溯到HTML 2 0 http