CSS 垂直居中
1.图片的垂直居中
.box
{
/*非IE的主流浏览器识别的垂直居中的方法*/
display: table-cell;
vertical-align: middle; /*设置水平居中*/
text-align: center;
/* 针对IE的Hack */
*display:block;
*font-size:175px;/*约为高度的0.873,200*0.873 约为175*/
*font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/
width:200px;
height:200px;
border:1px solid #eee;
}
.box img
{
/*设置图片垂直居中*/
vertical-align: middle;
}
<div class="box">
<img src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" mce_src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" />
</div>
参考文章:
http://www.planabc.net/2008/05/26/img_vertical_center_solution/
http://www.student.oulu.fi/~laurirai/www/css/middle/
相关文档:
分类:Web前端
IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_", IE8能识别" \9",但不能识别下划线"_", 而firefox两个都不能认识,却可以识别‘!important’。等等
书写顺序,一般是将识别能力强的浏览器的CSS写在后面。下面列举常用的CSS hack方法
1:!importan ......
用css实现网页背景渐变的代码如下:
一、从上往下渐变
Example Source Code [www.mb5u.com]
body{
FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);
}
二、从左上至右下渐变
Example Source Code [www.mb5u.com]
body{
FILTER: Alpha( style=1, ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<!-- www.div-css.com 网站标准化 2007-4-16 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
......
DIV+CSS设计的网站是按照W3C标准的,如果一个站点完全是CSS+DIV制作的,那么你网站的SEO(搜索引擎优化)工作已经完成了30%!为什么会这么说?SEO其他方面在哪好,请接着我的思路往下看:
石家庄网站优化
DIV+CSS 网站相当30%的SEO工作
1、div+css网站遵循“网页结构、表现、行为分离,互不干涉抢功”理念,且 ......