200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > div靠边隐藏_停靠在左边的DIV+CSS隐藏菜单

div靠边隐藏_停靠在左边的DIV+CSS隐藏菜单

时间:2023-03-15 14:51:31

相关推荐

div靠边隐藏_停靠在左边的DIV+CSS隐藏菜单

停靠在左边的隐躲菜单-

body {

background: #fff;

font-family: "Lucida Grande", Helvetica, Arial, sans-serif;

font-size: 12px;

}

.menu {position:absolute; z-index:100; margin-top:20px;}

.menu ul {padding:0; margin:0; list-style-type: none; height:170px;}

.menu ul li {width:35px; text-align:left;}

* html .menu ul li {width:235px; margin-left:-16px; mar\gin-left:0;}

.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; width:15px; padding:10px; background:transparent url(/jscss/demoimg/04/tab1.gif) top right; height:80px; text-align:center; border-left:1px solid #000;}

* html .menu ul li a, * html .menu ul li a:visited {width:35px; height:100px; w\idth:15px; he\ight:80px;}

table {margin:0; padding:0; border:0; border-collapse:collapse;font-size:1em;}

.menu ul li ul {visibility:hidden; position:absolute; width:190px; top:0; left:0;}

.menu ul li:hover {position:relative;}

.menu ul li:hover a {padding-left:200px;}

.menu ul li a:hover {padding-left:201px; position:relative; z-index:200; border-left:0;}

.menu ul li:hover ul,

.menu ul li a:hover ul {visibility:visible; z-index:300;}

/* / */

.menu ul li:hover ul li a,

.menu ul li a:hover ul li a {display:block; background:#d8e2e2 url(/jscss/demoimg/04/fade.gif); color:#888; text-align:left; height:auto; padding:5px; border:1px solid #000; border-width:1px 1px 0 1px; width:190px; w\idth:180px;}

.menu ul li:hover ul li a.last,

.menu ul li a:hover ul li a.last {border-bottom:1px solid #000;}

.menu ul li:hover ul li a:hover,

.menu ul li a:hover ul li a:hover {background:#e8f2f2; color:#000;}

.some_text {padding:0 20px 0 50px;}

D E M O SB O X E S

欢迎来到模板无忧()提供各类编程源码、视频教程、JavaScript/CSS殊效代码以及常用软件下载等,做有质量的学习型源码下载站。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。