2000万优秀解决方案库，覆盖所有编程及软件开发类，极速查询
今日已更新 1202 篇代码解决方案
2024-08-16 11:10:28 217人阅读
<!doctype html><html><head><meta charset="utf-8"><title>CSS之侧边栏</title><style>*{ margin:0;padding:0; }html{height:100%;}a:link,a:visited{color:#00FF00; text-decoration:none;}#side{ display:none;}#side:checked + aside{top:0;}#side:checked ~ #wrap{ padding-top:220px;}body > aside{position:absolute;top:0;bottom:0;top:-200px; width:100%;background:#333333;transition:0.2s ease-out;-webkit-transition:0.2s ease-out;height:200px; }body > aside > h2{color:#00FF00;text-align:center; font-weight:normal; padding:10px;}#wrap{ margin-left:20px; transition:0.25s ease-out; -webkit-transition:0.25s ease-out;}#wrap > label{ background:#333333;border-radius: 15px;color: #FFF;cursor: pointer;display: block;font-family: Courier New;font-size: 25px;font-weight: bold; width: 50px;height: 50px;line-height: 35px;text-align: center;text-shadow: 0 -4px; }#wrap > label:hover{background:#000; }</style></head><body><input type=‘checkbox‘ id=‘side‘><aside><h2><a href="http://www.cnblogs.com/caidupingblogs/">冷的锋刃</a></h2><h2><span >用冷的锋刃琴的寂寥写往事今朝</h2></aside></input><div id=‘wrap‘><!--侧边栏按钮标记，注意"="只是符号--><label for=‘side‘>^</label></div></body></html>
CSS之上边栏
https://www.u72.net/daima/be0u.html
联系 我们
回到 顶部
