
你知道这些css网页设计技巧吗
发布时间:2006-09-26 12:56:43 来源:csdn 网友评论 0 条8. 用CSS来处理垂直对齐
垂直对齐用表格可以很方便地实现,设定表格单元 vertical-align: middle 就可以了。但对CSS来说这没用。如果你想设定一个导航条是2em高,而想让导航文字垂直居中的话,设定这个属性是没用的。
CSS方法是什么呢?对了,把这些文字的行高设为 2em:line-height: 2em ,这就可以了。
9. CSS在容器内定位
CSS的一个好处是可以把一个元素任意定位,在一个容器内也可以。比如对这个容器:
#container { position: relative }
这样容器内所有的元素都会相对定位,可以这样用:
<div id="container"><div id="navigation">...</div></div>
如果想定位到距左30点,距上5点,可以这样:
#navigation { position: absolute; left: 30px; top: 5px }
当然,你还可以这样:
margin: 5px 0 0 30px
注意4个数字的顺序是:上、右、下、左。当然,有时候定位的方法而不是边距的方法更好些。
10. 直通到屏幕底部的背景色
在垂直方向是进行控制是CSS所不能的。如果你想让导航栏和内容栏一样直通到页面底部,用表格是很方便的,但如果只用这样的CSS:
#navigation { background: blue; width: 150px }
较短的导航条是不会直通到底部的,半路内容结束时它就结束了。该怎么办呢?
不幸的是,只能采用欺骗的手段了,给这较短的一栏加上个背景图,宽度和栏宽一样,并让它的颜色和设定的背景色一样。
body { background: url(blue-image.gif) 0 0 repeat-y }
此时不能用em做单位,因为那样的话,一旦读者改变了字体大小,这个花招就会露馅,只能使用px。
推荐阅讯
- 像表格table一样轻松布局div层
- ASP.NET 2.0配合MasterPage的优化CSS
- CSS实现星级评分III
- 推荐文章:CSS实现光滑圆角效果
- 相册的自动播放效果SlideShow
- 用css制作表单并体验亲和力
- 转:浅议 Web 的表单设计
- xsl传递参数在客户端单个xml分框架显示
- 搜索引擎的蜘蛛人(ROBOTS)秘密
- CSS+DIV网页特效欣赏:非常酷的角BANNER
阅读排行
- 1.如何使用CSS来进行网页排版
- 2.CSS样式表教程-If you love css …
- 3.CSS用样式表美化你的网页
- 4.网页制作:几种所见所得的WEB在线编辑器
- 5.网页常见可用性错误——表单组件错误
- 6.CSS+JavaScript打造超酷右键菜单
- 7.针对浏览器隐藏CSS之九大技巧
- 8.DIV+CSS网页布局入门
- 9.搜索引擎的蜘蛛人(ROBOTS)秘密
- 10.CSS垂直树形下拉菜单
专题教程
- 大话G游 专题:手机病毒揭密
- ARP攻击防范与解决方案 路由故障处理手册
- Picasa中文版_Picasa教程 专题:清除流氓软件
- Firefox专题 seo搜索引擎优化专区
- 重装Windows必知的事情 装机之必备软件大行动
病毒专杀栏
