这是一个未知大小的图片在一个已知大小容器中的水平和垂直居中的例子，原文标题：“Centeringanimageofunknownsizeinanoutercontainerofknownsize”，作者：StuNichollsform：http://www.cssplay.co.uk/menu/centered.html ，发表日期：15thOctober2006。此文由forestgan于2006-10-17翻译发表，更多文章。这个水平和垂直居中的例子能正常工作在IE5.x,IE6,IE7,Firefox,Opera,Mozilla,Netscape，为IE和非IE分别写了二套简单...
http://www.jb51.net//article/6586.htm
[html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><style>div {position:absolute;top:50%;left:50%;margin:-100px 0 0 -120px;}</style><div style="background:...
http://www.jb51.net//article/4373.htm
现在进行WEB重构的时候,一般我们做DIV 居中是这样: [code]body{margin:0px auto;text-align:center;}[/code]但是在没申明下面这句解析方法的时候,页面就会出错.不能居中对齐![code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">[/code]为此困扰了我几天.那么有的朋友就会说:你加上这句不...
http://www.jb51.net//article/4183.htm
这是我刚刚作的一个导航条，为了让那四个LINK居中，我这样作了，但作完后发现了很多的问题，写出来和大家分享一下！首先我们先来看一下这个导航条！[html]<!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"><hea...
http://www.jb51.net//article/1217.htm
先来看我一个简单XHTML/HTML文件代码（部分），我们的目的是让#container水平居中。<body> <div?id="container"> <h1>content</h1> <p>Lorem?ipsum?dolor?sit?amet,?consectetuer?adipiscing?elit.Phasellus?varius?eleifend.</p></div></body>使用自适应边界（auto?margin）水平居中任意元素的首选办法是使用边界（m...
http://www.jb51.net//article/1193.htm
除特别说明外，本站内容采用创作共用授权署名和非商业用途,请尊重劳动成果。CSS布局中,未知大小图片的垂直居中，一直是比较头疼的问题,标准浏览器只要设定容器的line-height和图片的vertical-align:middle;就可以了，但对IE没用，几个月前在国外网站看到了一则对IE的解决方法，感觉不是很理想，也没当回事。最近看到经常有朋友在问类似的问题，又把代码翻了出来，针对IE改了下。CSS .box{ height:140px; width:200px; border:solid1px#666; &...
http://www.jb51.net//article/1172.htm
除特别说明外，本站内容采用创作共用授权署名和非商业用途,请尊重劳动成果。原文标题：VerticalCenteringinCSS副标题：Yuhu'sDefinitiveSolutionwithUnknownHeight翻译：forestgan尽管有CSS的vertical-align特性，但是并不能有效解决未知高度的垂直居中问题（在一个DIV标签里有未知高度的文本或图片的情况下）。标准浏览器如Mozilla,Opera,Safari等.，可将父级元素显示方式设定为TABLE(display:table;)，内部子元素定为table-cell(display:table-cell),通过verti...
http://www.jb51.net//article/1171.htm
今天google了一下css居中布局的问题，结果差不多都是引用了同一篇文章。在ie中要居中，只要在<body>元素中定义text-align:center;的属性。而在firefox中，需要定义一个wrapper包裹器。然后指定margin-left:auto;margin-right:auto;的属性来使区块在firefox中居中。其实，我自己都是用margin:auto;的缩写margin属性来设定居中。margin缩写属性是上、右、下、左的顺时针顺序来设定四个方位的页面边距的。需要注意的是，如果你据此以为只要设定margin-top:auto;属性后就想使区块居中的话，那你就...
http://www.jb51.net//article/1170.htm
最常见实用的布局形式：上、中左、中右、底四个模块，宽度760px，整体页面居中。结构代码，topleftrightfoot四个模块全部独立、互不嵌套。＜divid="top"＞head＜/div＞＜divid="left"＞ ＜divid="left_module"＞left＜/div＞＜/div＞＜divid="right"＞ ＜divid="right_module"＞right＜/div＞＜/div＞＜divid="foot"＞foot＜/div＞顶部属于常规定义。#top{height:100px;background:#ccc;width:760px;margin...
http://www.jb51.net//article/1161.htm
如何使DIV居中主要的样式定义如下：body{TEXT-ALIGN:center;}#center{MARGIN-RIGHT:auto;MARGIN-LEFT:auto;}说明：首先在父级元素定义TEXT-ALIGN:center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT:auto;MARGIN-LEFT:auto;”需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div，只要在每个拆出的div里定义MARGIN-RIGHT:...
http://www.jb51.net//article/1157.htm
CSS布局中,未知大小图片的垂直居中，一直是比较头疼的问题,标准浏览器只要设定容器的line-height和图片的vertical-align:middle;就可以了，但对IE没用，几个月前在国外网站看到了一则对IE的解决方法，感觉不是很理想，也没当回事。最近看到经常有朋友在问类似的问题，又把代码翻了出来，针对IE改了下。CSS.box{height:140px;width:200px;border:solid1px#666;text-align:center;/*水平居中*/line-height:140px;font-size:126px;/*IE靠这垂直居中*/}.box[class]{...
http://www.jb51.net//article/1143.htm