css|标准|网页
符合标准网页中用DIV CSS如何对段落进行排版的？通过这篇教程你就会有所了解
margin
div css布局中段落使用<p>标签，对于段落的上下左右的空白（缩进）可以使用margin标签定义样式。margin有上、下、左、右四个方向的定义，正常情况下，我们可以用一行来描述我们需要的样式。
例如：margin: 20px 8px 8px 20px;
此句分别表示了：margin-top；margin-right；margin-bottom；margin-left。
四个数值的顺序分别是：上、右、下、左。是依时12:00开始的顺时针方向。
如何上下的值一致，左右的值一致，我们可以再进行优化。
可以写成：margin:20px 8px;
此句分别表示了：上下、左右。
对于段落内部的文字对齐方式，一般用text-align，比如：text-align: center;等。
下面以实例的形式来看不同的段落排版：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>webjx.com</title><style type="text/css"><!-- div { width:500px; background:#ccc;}p { border:1px solid red; background:#fff;}#p1 { margin: 20px 8px 8px 20px;/*上。右。下。左*/ text-align:center;}#p2 { margin: 20px 8px;/*上下。左右*/ text-align:right;}#p3 { margin: 20px;/*四边均是*/ text-align:left;}--></style></head><body><div><p id="p1">webjx.com - Div CSS布局 常见问题</p><p id="p2">webjx.com - Div CSS布局 常见问题</p><p id="p3">webjx.com - Div CSS布局 常见问题</p></div></body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
padding
对于段落内部的空白，我们可以用padding来实现。padding的一些属性与margin类似，这里就不再重复。我们看下面的例子：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>webjx.com</title><style type="text/css"><!-- div { width:500px; background:#ccc;}p { border:1px solid red; background:#fff;}#p1 { margin: 20px 8px 8px 20px;/*上。右。下。左*/ padding-top:20px;/*距离上部20象素*/ text-align:center;}#p2 { margin: 20px 8px;/*上下。左右*/ padding-bottom:20px;/*距离下部20象素*/ text-align:right;}#p3 { margin: 20px;/*四边均是*/ text-align:left; padding:20px 0;/*距离上下部各20象素*/}--></style></head><body><div><p id="p1">webjx.com - Div CSS布局 常见问题</p><p id="p2">webjx.com - Div CSS布局 常见问题</p><p id="p3">webjx.com - Div CSS布局 常见问题</p></div></body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]