1)嗨,http://www.getustad.com/TableProject/是一个 10 列的页面,我需要位于页面的中心,如果我更改页面的分辨率 [移动到更大的屏幕],所有列都不应该向左移动。
2)如何使html视图独立于屏幕分辨率?
请帮忙谢谢
1)嗨,http://www.getustad.com/TableProject/是一个 10 列的页面,我需要位于页面的中心,如果我更改页面的分辨率 [移动到更大的屏幕],所有列都不应该向左移动。
2)如何使html视图独立于屏幕分辨率?
请帮忙谢谢
将所有列包装在具有设置宽度属性的 div 中,例如
<div id="main_body">
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
<div class="column"></div>
</div>
Set the css properties of main_body to whatever u want. ex: align:center. width:840px; etc
如果表的 id 为“mytable”,您可以这样做:
table#mytable
{
margin-left: auto;
margin-right: auto;
width: 50em;
}
但是,它在旧浏览器中不起作用。
嘿,现在您可以像这样更改您的 html 和 css 代码
CSS代码
#main{
margin:0 auto;
border:solid 1px red;
text-align:center;
}
.box{
margin:2px;
background:rgba(0,0,0,0.2);
display:inline-block;
vertical-align: top;
}
HTML 代码
<div id="main">
<div class="box">
<img src="">
<p>Oncenter</p>
</div>
<div class="box">
<img src="">
<p>Oncenter</p>
</div>
<div class="box">
<img src="">
<p>Oncenter</p>
</div>
<div class="box">
<img src="">
<p>Oncenter</p>
</div>
</div>