居中一直是设计师们比较喜欢使用的一种摆放形式，无论是图片还是文字都会被要求放在中间，水平或者垂直。css提供了很多方便的让内容居中的方法给我们使用，以下罗列那些最长被使用的居中技巧。
      水平居中的text-align:center 和 margin:0 auto
      这两种方法都是用来水平居中的，前者是针对父元素进行设置而后者则是对子元素。他们起作用的首要条件是子元素必须没有被float影响，否则一切都是无用功。margin:0 auto也可以被写成margin:0 auto 0 auto。不能理解的童鞋们可以自己去找找关于css缩写的内容。
      垂直居中的line-height
      什么？！margin在垂直居中里不起作用了？显然事情确实如此，我们仅有margin:0 auto的用法而没有auto 0的情况。至于line-height，他也是作用在父元素上，当他的值等于父元素的height值时，内部的文字就会自动的垂直居中了。此处好像仅仅只能是文字而已。
      万能的position大法
      这个方法可以说真的是万能的。当你为一个元素无法居中而困扰的时候，可以果断的使用他，而且几乎没有后遗症，绝对是前端工程师们居家旅行必备的手段之一。
      具体的做法很简单，首先给父元素写上positon:relative，这么做是为了给子元素打上position:absolute的时候不会被定位到外太空去。接下去，写上子元素的height和width，这个似乎是必须的，某些浏览器在解析的时候如果没有这2个值的话会出现意想不到的错位。接着就是整个方法的核心，给子元素再打上top:50%;left:50%以及margin-top:一半的height值的的负数;margin- left:一半的weight值的负数。整理一下之后，可能你会给你的子元素写上这样的css（当然，父元素也要先写上width和height）{width:100px;height:80px;position:absolute;top:50%;left:50%;margin-left:50px;margin-top:40px} 接下去就刷新页面吧，你的子元素已经是居中显示了。
      使用这个方法的好处在于无论你是什么形式的内容都可以马上居中，而缺点就是必须对元素有确定的宽高值，否则的话可能就需要通过javascript来进行一些小计算了。

本文作者来自天津求谛互动，转载请注明出处：求谛互动（http://qd218.com）
选择天津网站建设公司-求谛互动，优质服务，绝对不容错过 ！
1. 优秀的网络资源，稳定的网站和速度保证
（配送双线独立ip空间，国际A级BGP机房，99.5% 的主机在线时间）
2. 7年天津网站建设经验，优秀的技术和设计水平，更放心
3. 全程省心服务，不必担心自己不懂网络，更省心。
------------------------------------------------------------------------------------------
我们的与众不同之处：
免费网络营销顾问：我们为您提供免费的网络营销顾问服务，您需要了解关于如何开展网络营销，电子商务，网站设计等的事宜，欢迎随时联系我们。

seo友好的网站管理系统：除了优质的网站空间，网站管理系统，和网站设计外，我们的网站管理系统更是seo友好的，包括：自定义栏目名，Google Sitemap自动生成，静态页面生成等等，让您的网站。

免费网络营销培训：如何更好的投放网络广告，如何提高网络广告的投资回报，如何发帖子，
如何优化网站，我们有丰富的经验开放给您！祝君成功！
联系我们：022-66351726

天津网站建设本站关键词：天津网站建设  天津网站制作  天津网站设计  网站建设  天津网站建设公司  网站建设