《
使用CSS定位的网页footer》文章地址:http://www.tfxk.com/wangyesheji/jianzhanjingyan/030233O12013.htm
Tag:定位 定位
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict,使用CSS如何实现自动换行和强制不换行.dtd">,使用CSS制作网页的15条常识; <,使用CSS创建有图标的网站导航菜单;html xmlns=" <head> <,使用CSS3实现鼠标悬停动画;title>使用CSS定位footer---建站学www.jzxue.com</title> <style type="text/css"> body,html { margin: 0; padding: 0; font: 12px/1.5 arial; height:100%; } #container { position: relative; min-height:100%; } #content { padding: 10px; padding-bottom: 60px,使用CSS+XHTML制作的下拉菜单(代码); /*(20px font-size x 2 line-height) + (2 * 10px padding) = 60px*/ } #footer { position: absolute; bottom: 0,使用CSS 3新技术 完美实现圆角效果; padding: 10px 0,使用Combres合并对js、css文件的请求; background-color: #AAA; width: 100%; } #footer h1 { font: 20px/2 Arial; margin:0; padding:0 10px; } </style> </head> <body> <div id=",你需要了解的21个CSS惊人技巧;container"> <div id="content"> <h1>Content</h1> <p>请改变浏览器窗口的高度,以视察footer效果。<,你究竟要做什么样的网站?;/p> <p><a href=" <p><,你知道CSS样式中“大于号”的作用吗;a href=" </div> <div id="footer"> <h1>Footer</h1> </div> </div> </body> </html>
--> [
网站建设之]应用CSS定位的网页footer
使用CSS定位footer。请转变阅读器窗口的高度,以察看footer后果。
运行代码复制代码另存代码珍藏本页 [Ctrl+A 全体抉择 提醒:你可先修正局部代码,再按运行]
(责任编辑:网站建设)
使用CSS定位的网页footer相关文章