2013-04-08 43 views
0

我有下面的html.What我试图做的是中心的p标签的内容。事情是,如果我做一个对齐的div然后它的作品,但当我这样做在p标签它不。用CSS不好,并希望快速解决方案,所以问你们的帮助。对齐css的属性

<html> 

    <head></head> 

    <body> 
     <div> 
      <p align="center" style="width:500px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor neque augue. Mauris a ante et libero tincidunt lacinia. Donec at lorem eu mi sagittis pretium. Donec sed ligula vel nunc placerat auctor quis vitae est. Nullam varius leo sed elit auctor rutrum. Pellentesque at erat quis nibh eleifend tincidunt sed feugiat est. Fusce dolor ante, imperdiet in congue ut, vulputate vitae nisi. Vivamus hendrerit felis a leo laoreet eget mollis purus tempus. Etiam fringilla est lacus. Praesent quis purus sem. Vestibulum interdum scelerisque consectetur. Nam nulla est, lacinia in eleifend eget, ultricies at est. Phasellus congue sollicitudin tellus, sit amet lobortis odio interdum et. Quisque turpis elit, feugiat in laoreet mollis, tempus et leo. Morbi eget viverra enim. Donec nec lacus dolor. Suspendisse tincidunt mi in enim gravida et fringilla lacus ultrices. Integer ac augue at nulla sollicitudin placerat. Morbi et ligula quis mauris consequat egestas vel et sapien. Ut ut justo a augue ullamcorper egestas ullamcorper vel nisl. Cras quam ligula, pharetra at pulvinar et, scelerisque vel erat. Donec scelerisque metus vitae libero accumsan quis suscipit urna pretium. Curabitur imperdiet, turpis a pulvinar adipiscing, nibh felis fringilla felis, nec consequat felis justo accumsan est.</p> 
     </div> 
    </body> 

</html> 
+1

也许'”将工作? – 2013-04-08 15:14:58

+1

你想把段落本身或者文本放在中间吗?如果你想对齐文本,请使用text-align:center; – Michael 2013-04-08 15:16:26

+0

我试图将段落本身集中为 – user505210 2013-04-08 15:27:15

回答

3

align是HTML 5 deprecated attribute ..代替得到<p>显式宽度和添加:

margin: 0 auto;以整个元素为中心吨(顶部/底部0,左/右自动)

text-align: center;居中元件文本

+0

这中心的段落标记本身,OP要中心的内容P. – Michael 2013-04-08 15:16:55

+1

@Michael:是的,非常感谢您指出,固定 – Adrift 2013-04-08 15:19:46

+0

所以你赚+1 =) – Michael 2013-04-08 15:20:59

1

这是因为属性对齐是meant for divs。此外,它已被弃用,有更好的方式来设置段落的样式。

这里是一个jsFiddle的例子。

CSS:

div { 
    width:100%; 
} 

p { 
    text-align:center; 
} 

HTML:

<div> 
    <p>Hello</p>   
</div> 
+0

-1。纠正贬损,但你应该给他一个更好的方法。 – Nix 2013-04-08 15:14:49

+1

谢谢。现在它是一个更有用的答案。 – Nix 2013-04-08 15:24:51

+0

我已经创建了这个小提琴http://jsfiddle.net/dG6Ck/ ..我尝试在简单的div和p中使用你的解决方案,它的工作原理..你可以看看我的例子,看看那边有什么问题。 – user505210 2013-04-08 15:33:51

1

文本是中心对齐。我已经在最新的IE,Chrome和Firefox中测试过它。

您可以尝试<p style="width:500px; text-align:center">

+0

OP想要对齐文本块,而不是文本。 – 2013-04-08 15:17:58

+0

@AleksG“我试图做的是将p标签的内容居中” 这意味着他正在将文本本身集中到段落本身中。 – Michael 2013-04-08 15:19:05

+0

如果您阅读问题中的代码,他试图达到'align =“center”',这意味着对齐块而不是文本。 – 2013-04-08 15:22:16

0

我刚刚检查了你的问题,而实际上该文本在您的p标签居中。我认为你正试图将您的p标签的div的中心, 并且可以实现通过

p 
{ 
margin:0 auto; 
} 

这里也是fiddle

只是一个建议:一个好的做法是分离你的html样式,所以把你的样式移动到一个单独的样式表中。

0

尝试

<p style="width:500px;margin:auto">...</p>