Archive

Posts Tagged ‘css’

防图片太大撑破页面css

January 9th, 2010
3 comments 487 views

这个在网页布局里很常见,网上看到有人用overflow:hidden来隐藏超出部分的图片,但那样图片就被截断了,不够完美。
用个简单的css max-width: 100%;可以解决这个问题,css代码如下:

img{
max-width: 100%;
height: auto;
vertical-align: middle;
}

不过max-width在IE6.0中是无效的,为了照顾到IE6.0,还是顺便把overflow:hidden加上比较好

设计布局 ,

div自适应高度

January 1st, 2010
No comments 342 views

朋友问一个div自适应高度的问题,其实我也好久没关注css了,但是朋友问起来,还是帮忙解决一下。我没怎么深入去研究,只是从pjblog的皮肤里提取了最外层的div框架就能得到这个div自适应高度的案例。贴出代码如下:
css

<style>
/*---主体样式---*/
  #container{width:960px;margin:0 auto;padding:0;text-align:centermargin-top:10px;/*/margin-top:0px;*/}
/*---内容样式---*/
#container #Tbody{float:left;width:960px;background:#777C7F repeat-y center;margin:0px;text-align:left;}
 
/*---工具条--*/
#sidebar{float:right;width:300px;margin:10px 25px 10px 0;*margin:10px 25px 10px 0;_margin:10px 12px 10px 0; background-color:#0000FF;}
/*---主内容--*/
#mainContent{float:left;width:600px; /*border-right:#eee 1px solid;*/text-align:center;margin:10px 0 10px 20px;_margin:10px 0 10px 6px;background-color:#006600;}
</
style>

Read more…

设计布局 ,

记一个每段开头空两格的css

October 22nd, 2009
No comments 406 views

每段开头空两格css

p{
text-indent: 2em;
}

设计布局