绝对居中的层div+css代码示例
| 以下是代码： <html> <head> <title>Nice and Free CSS Template 11</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"><!-- /* body und schrift deffinitionen */ body { background-color: #e1ddd9; font-size: 12px; font-family: Verdana, Arial, Helvetica, SunSans-Regular, Sans-Serif; color:#564b47; padding:0px; margin:0px; } #inhalt { position:absolute; height:200px; width:400px; margin:-100px 0px 0px -200px; top: 50%; left: 50%; text-align: left; padding: 0px; background-color: #f5f5f5; border: 1px dotted #000000; overflow: auto; } p, h1 { margin: 0px; padding: 10px; } h1 { font-size: 11px; text-transform:uppercase; text-align: right; color: #564b47; background-color: #90897a; } a { color: #ff66cc; font-size: 11px; background-color:transparent; text-decoration: none; } --></style> </head> <body> <div id="inhalt"> <p><b>centered</b><br /><br /> This area should be horizontally and vertically centered.<br /> This text stays left aligned<br /> <b>ie mac doesn’t like this! </b><br /> <a href="/">more nice and free css templates</a> </p> <p> <img src="xhtml10.gif" alt="" width="80" height="15" border="0"/><br/> <img src="css.gif" alt="css" width="80" height="15" border="0"/><br /> </div> </body> </html> |
以下是HTML网页特效代码，点击运行按钮可查看效果：
以下是程序代码
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
