简体繁体 English

使用CSS我应该使用p标签来包装文本还是div足够？

[英]With CSS should I use p tag to wrap text or will div suffice?

原文 2010-06-07 07:12:06 7 9 html/ css

As the title says, would it be better to wrap text using <div> or using <p> . 正如标题所说，使用<div>或使用<p>包装文本会更好。 Which would work better for SEO? 哪个更适合SEO？

9 个解决方案

Semantically you should always use <p> to hold any "content" text within the body of your page. 在语义上，您应始终使用<p>在页面正文中保存任何“内容”文本。 Similarly, headings should always go in <h1> , <h2> etc. Only use <div> for layout and positioning purposes (so for example as a wrapper around the main body of content, sidebars etc). 类似地，标题应始终位于<h1> ， <h2>等。仅使用<div>进行布局和定位（例如，作为内容主体，侧边栏等的包装）。

Search engines will typically rank pages using semantic HTML higher in their results as pages laid out in this way are more "machine-readable". 搜索引擎通常会使用语义HTML对页面进行排名，因为以这种方式布局的页面更“机器可读”。

Div always uses for styling and decorating the form so that it is not a useful element to wrap texts. Div总是用于样式化和装饰表单，因此它不是包装文本的有用元素。 in a well-formed & standard html tag, you have touse p to show the search engine or whoever, that you are displaying a paragraph or your are writing some text 在一个结构良好的标准html标签中，你有p来显示搜索引擎或者你正在显示段落或者你正在写一些文本的人

It is not a command but a best practice which you need to follow for a better coding. 它不是命令，而是您需要遵循的最佳实践，以获得更好的编码。

Do not use same element for same reasons. 出于同样的原因，请勿使用相同的元素。 each one has one destiny. 每个人都有一个命运。

Search engines crawl the page and look for semantic structure and determine a logical hierarchy for your content. 搜索引擎抓取页面并查找语义结构并确定内容的逻辑层次结构。

<h1> tags are treated different to <h2> , <h3> and so on. <h1>标签的处理方式与<h2> ， <h3>等不同。 a <div> tag would put your content on par with other content within other div tags. <div>标记会使您的内容与其他div标记中的其他内容相同。

I'd choose <p> over a <div> if the content is 'important', relates to what your website is about and has a chance to contribute towards your SEO. 如果内容是“重要的”，我会选择<p>而不是<div> ，这与您网站的内容有关，并且有机会为您的SEO做出贡献。

You should always use the right tag for the job. 您应该始终使用正确的标签来完成工作。

<div> is used to divide the page into logical sections. <div>用于将页面划分为逻辑部分。 <p> is for paragraphs of text. <p>用于文本段落。 <h1> through <h6> are used for headings. <h1>到<h6>用于标题。 <ul> and <ol> represent lists of data. <ul>和<ol>表示数据列表。 <table> and it's children are for tabular data. <table> ，它的子项是表格数据。 <form> is for forms and so on. <form>用于表格等。

Working this way has benefits for SEO because the search engines know what sort of data they're reading and can rank it's importance accordingly. 以这种方式工作对SEO有好处，因为搜索引擎知道他们正在阅读什么类型的数据并且可以相应地对其进行排序。 It also gets you a good way towards improving accessibility (eg screen readers will often build a page outline based on heading structure). 它还为您提供了改善可访问性的好方法（例如，屏幕阅读器通常会根据标题结构构建页面大纲）。 More importantly for you, it makes it a lot easier to style your website consistently. 更重要的是，它可以更加轻松地为您的网站设计风格。

据我所知，它对SEO没有任何影响， p会很好。

从语义上讲， p应该代表一个段落并且div是一个任意的（子）划分 - 实际上，两者之间的区别是模糊的，当然对于SEO目的无关紧要。

you should use one of them if you are using <P> than don't use wrap these both are same and no one is better for seo because html and css code don't have mean for seo. 你应该使用其中一个，如果你使用<P>而不是使用wrap这些都是相同的，没有人更好的seo因为html和css代码没有seo的意思。 if html tags or css name can make site better than seo have no mean because about all site have html tag. 如果html标签或css名称可以使网站比seo更好没有意思，因为所有网站都有html标签。 that sure alt and title can make your site according seo.so you should use one of them according you. 确保alt和title可以使你的网站符合seo.so你应该根据你使用其中一个。 <p> or wrap <p>或wrap

As long as only word wrap is concerned, they are the same. 只要涉及自动换行，它们就是一样的。 you can set CSS attribute of word-wrap with break-word to force word wrap, see a cross browser solution here . 您可以使用break-word设置自动换行的CSS属性以强制自动换行，请在此处查看跨浏览器解决方案。 you can even do word hyphenation or justification using this lib . 你甚至可以使用这个lib做单词连字或辩解。