css样式左对齐

html-css09

css样式左对齐,第1张

<style type="text/css">

*{margin:0padding:0list-style:noneborder:nonefont:12px/22px 宋体}

a{text-decoration:none}

.txt{width:320pxborder:1px solid #000margin:0 autotext-align:left}/*margin:0 auto让div居中,text-align:left让文字在div中居左*/

</style>

<div class="txt">

<ul>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

<li><a href="#">·怎么让这些文字在网页中间,但是文字开头是对齐的</a></li>

</ul>

</div>

div里只要没设置over-flow:scroll,溢出内容不会出现拖动条,table也不会出现,iframe默认会出现,可以scrolling="no"关掉拖动条,

默认文字内容都是左对齐,table里用align=left/right设置左右对齐,

div不支持,可用hack的方法,兼容性我还未研究过,iframe是框架没有此说.

1、div左对齐条件与方法只需要对要靠左对齐(局左)的div样式加float:left即可,这里新建一个html文件,创建一个div容器并给它一个class属性,容器里面是两个div,一个靠左对齐,一个靠右,以示区别:

2、接下来设置css样式,在style标签中,设置div的float值为left,就实现左对齐了,最后在给div高度,宽度,边框属性设置值,右边的div除了float设为right,其他都是一样的:

3、最后来到浏览器中,可以看到div在浏览器中是居左的,另一个是居右的: