空间文本的正确方法?

时间:2012-01-05 22:43:49

标签: html css html5 text

几个月前,我学会了网页设计的基础知识,并且正在尝试修复我设置的基本网站以遵守标准并且看起来有点整洁。我写它的方式是用不间断的空间来分隔我的段落。我敢肯定你们都在撕扯你的头发,但这就是为什么我要努力改进。

但是,我仍然不确定正确的文本分隔方法是什么。我的第一个是使用边距,这意味着将段落元素的显示设置为阻止。考虑到可能有更多适合使用的元素,改变元素的结构是不对的,我决定检查一些网站以了解它们是如何做到的。我检查过的每一个都使用了CSS中的display:block和margin属性。

这是正确的方法吗? HTML5中是否有替换它的东西?如果我确实使用HTML5,那是否意味着旧版浏览器无法正常显示?

3 个答案:

答案 0 :(得分:2)

为每个段落使用标记<p>

HTML 5向后兼容。

P标签不包含HTML 5.它适用于所有版本的HTML。

答案 1 :(得分:1)

p元素 是一个块元素,用HTML表示,默认情况下也用CSS术语表示。因此,如果您喜欢与默认边距不同的东西(没有左边距或右边距,但顶部和底部边距通常对应于每个空行),您可以在其上设置边距。您在CSS中专门设置的内容取决于您希望实现的目标,这在问题中并不明显。

默认渲染,其中段落由等效的空行分隔,遵循简单的办公自动化系统和旧打字机的做法。如果您更喜欢更传统的书籍渲染,可以通过第一行缩进替换空行,例如

p { margin: 0; text-indent: 1em; }

答案 2 :(得分:0)

听起来我觉得你想控制你的段落之间的空间,这是正确的吗?您不必将p元素设置为显示为块。如果您希望段落间距在所有浏览器之间保持一致,我建议首先要确保所有浏览器都使用完全相同的间距,方法是将边距重置为空。看看Eric Meyer非常着名的CSS reset给你一个很好的清单。接下来,在你的CSS中,你可以为你的段落设置一个余量,无论你想要多少空间。请注意,如果你只使用margin:property而不是margin-bottom,你的段落将是你想要的两倍(第二段的margin-top将添加到你的第一段的margin-bottom,依此类推)。

如果全部重置,您可以在CSS中添加这样的规则:

p {
 margin-bottom: 16px;   /*  Sets the margin only below the paragraph element  */
 text-indent:  10px;    /*  Indents the first line of your paragraph   */
 }

另外,请记住,CSS重置往往会撕掉很多浏览器的标记默认值,所以请记住,当你的h1标签看起来很小而不再是粗体时!希望这会有所帮助。