最近在做html.
1導航固定:
position:fixed? (相當于當前窗口的定位)
bottom:0px
2.鼠標放在一級菜單上顯示二級菜單:
#nav_ul>li>ul{? /*二級菜單隱藏*/
?????? display: none;
}
#nav_ul>li:hover
ul{ /*當鼠標放在一級菜單上,顯示二級菜單*/
?????? display:block
}
3.二級菜單會被下方的內容蓋住:
1、必須是同級；
2、二者分別設定了position:relative 或 absolute 或 fixed；
這時候通過設置z-index才有效
1.下方的內容設置成為z-index: -1;二級菜單就不會被蓋住.
2.第二種情況（z-index無論設置多高都不起作用情況）：
這種情況發(fā)生的條件有三個：
(1)父標簽 position屬性為relative；
(2)問題標簽無position屬性（不包括static）；
(3)問題標簽含有浮動(float)屬性。
解決辦法有三個（任一即可）：
(1)position:relative改為position:absolute；
(2)浮動元素添加position屬性（如relative，absolute等）；
(3)去除浮動。
如下代碼:
#haiyang_one_right{
?????? z-index: -1;
?????? position: relative;
?????? float: right;
}
4.當a溢出:
標簽內容過長時,并不會截取字,overflow:hidden;?/*溢出隱藏*/
5.清除浮動:
父元素加上class屬性clearfix,然后css中寫如下內容:
.clearfix{
?????? zoom: 1;
}
6.讓div中的img垂直居中:
div{
display:inline-block;
?????? margin:0 auto;
?????? text-align:center;
}
img{
?????? padding-top:30px;
}
7.標簽變化,標題和圖片都變化? ?
//當鼠標經過a標簽時,對應的標題變化,對應的圖片img也改變.
$("#one_li a").hover(function(){
???????? $(this).parents("#one_li").find(".show_title").text($(this).attr("value"));
???????? vardata=$(this).attr("data_img");
???????? $(this).parents("#one_li").find("img").attr("src",data);
?????????????????? })
find()可以尋找孫子,
