CSS-水平对齐

来源:互联网 发布:网站源码加密破解 编辑:程序博客网 时间:2024/04/29 15:43

块元素对齐:

块元素是一个元素,占用了全宽,前后都是换行符(块元素可以把左,右页边距设置为"自动"对齐)

块元素的例子:

<h1>

<p>

<div>


中心对齐-使用margin属性

margin属性可任意拆分,页边距设置自动指定,结果都是出现居中元素(如下实例所示):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>margin</title><style>.sw{margin:auto;width:65%;background-color:#00FF00}</style></head><body><div class="sw"><p>文本</p></div></body></html>

左右对齐(Position)

.right{position:absolute;right:0px;width:300px;background-color:#b0e0e6;}

使用float设置左右对齐(详见上一篇关于float的介绍)

<style>.right{float:right;width:300px;background-color:#b0e0e6;}</style>


0 0
原创粉丝点击