网页居中代码怎么写

1.如何用html代码实现网页上下居中这个问题对很多新手来说都是难以挑战的难度,就是网上有代码很多人都难以了解 。其原理很简单,就是把块级元素变成行内元素,定义样式vertical-align:middle,让其垂直居中 。这里面有两个难点,1、怎样把块级元素变成行内元素并可以定义大小,而且还要兼容(要了解IElayout) 。2、如何用好vertical-align:middle,vertical-align:middle用在表格上很见效,谁都可以用,用在行内元素怎样才能起作用呢等等 。
代码我写给你,你自己去琢磨
<style>
.box{display:inline-block;}
.box{*display:inline; *zoom:1; width:50px; height:80px; border:#000 1px solid; vertical-align:middle;}
i{display:inline-block; width:0; height:100%; vertical-align:middle;}
</style>
</head>
<body>
<div style="width:200px; height:200px; border:red 1px solid; text-align:center;">
<i></i>
<div class="box">afdafd</div>
</div>
2.div居中代码怎么写如果只是水平居中的话,只需要先定义DIV的宽度,再设置外边距margin属性的左右边距为auto即可 。此时DIV便会相对于它的父容器水平居中 。
比如 <div class=div_a><div class="div_b"><div></div>
设置div_b的样式
.div_b{width:100px; margin:0 auto;}
这样div_b便在div_a中水平居中了 。如果外面没有父DIV,则div_b便相对于整个页面居中 。注意如果div_b定义了浮动属性float则无效 。
3.网页自动居中代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
<html xmlns="
<head>
<meta ; charset=utf-8" />
<title>;自动居中</title>
<style type="text/css">
*{margin:0;padding:0;}
.container {
background-color: #090;
height: 1000px;
width: 950px;
margin-right: auto;
margin-left: auto;
}
</style>
【网页居中代码怎么写】</head>
<body>
<div class="container">;你可以不断改变窗口的大小看效果,绿块会一直垂直居中,
当窗口小于设定宽度会从左边开始显示,而且产生滚动条,跟你给的那个网站效果一样 。</div>
</body>
</html>
4.这个网页居中CSS样式怎么写哦<table border="1" width="729" id="table1" height="50" style="margin:0 auto;">
<tr><td rowspan="2" width="120" height="44">aaa</td>
<td width="263" height="25" colspan="3">ccc</td>
<td rowspan="2" width="121" height="44">ddd</td>
<td rowspan="2" width="121" height="44">yyyy</td>
</tr>
<tr>
<td width="121" height="25">111</td>
<td width="121" height="25">222</td>
<td width="121" height="25">333</td>
</tr>
</table>
也可以再外面套个DIV 设置下宽,margin:0 auto;
5.HTML文字居中怎么写1、如果这排文字放在table里,这样写:
<table>
<td align="center"> <;!--让td中的内容居中-->
<a href="http://www.xuexi88.com/zhishi/链接到那里">;链接字</a>
</td>
</table>
2、在css里给这排文字定义一个类为footer,如下:
首先在<head></head>;中设置css:
<style type="text/css">
.footer{
text-align:center //设置最下排文字居中显示
</style>
然后在body里插入footer(最下排的字)类的div:
<div class="footer">
<a href="http://www.xuexi88.com/zhishi/链接地址">;服务条款</a>
|
<a href="http://www.xuexi88.com/zhishi/链接地址">;广告服务</a>