当前位置: 网站建设 > 网页设计 > 建站经验 >

使用CSS定位的网页footer

时间:2013-03-02 03:53来源:未知 作者:admin 点击:

标签:使用CSS定位的网页footer 定位(32)footer(2)DOC(3)网页(168)使用(77)Tag(145)CSS(655)
Tag:定位 定位 !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN DTD/xhtml1-strict, 使用CSS如何实现自动换行和强制不换行 .dtd html xmlns= head title使用CSS定位footer---建站学www.jzxue.com/title style type=text/css body,html { margin: 0;
使用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相关文章
上一篇:使用CSS如何实现自动换行和强制不换行 下一篇:使用CSS定位页面的“footer”
回到顶部