-
大多数浏览器兼容的圆角css代码：-webkit-border-radius:4px;-moz-border-radius: 4px;-o-border-radius: 4px;border-radius:4px;查看全部
-
网站导航菜单是易用性最重要的关注点之一。良好的导航菜单应该为用户解决三个问题是: 我现在在哪儿? 我知道下一步想去哪儿,但是该怎么去? 我也不知道下一步该去哪儿，请告诉我应该去哪儿? … 网站导航菜单应该简单、统一、明显,宗旨就是尽量少给用户机会自己选择,而是让用户沿着事先规划好的路径浏览网站. 用户有时心里很清楚想看什么内容,网站的导航菜单就应该预想到,用户在什么时候最想看什么信息,适时地把相应链接展现在用户眼前.这个链接看似是用户自己想去的地方,但其实也是营销人员最想让用户去的地方.查看全部
-
list-style:none;清除无序列表中的圆点查看全部
-
文字移动建议用text-indent（文本缩进），如果用padding-left会导致总宽度也发生改变
查看全部 -
ext-indent 文本缩进
list-style：none；去掉圆点
text-decoration：none；去掉下划线
<a>标签的设置关键是将标签设置为块元素
display：block；转化为块元素，可以设置长宽属性
a:hover{} 鼠标放上去的隐藏效果
li{float:left;} --浮动左对齐变成水平导航栏 --删除掉之前的文本缩进 text-indent:10px;圆角css代码：border-radius:4px 4px 3px 3px
查看全部 -
window.onload=function(){
var aLi=document.getElementsByTagName('li');
for(var i=0; i<aLi.length; i++){
aLi[i].onmouseover = function(){
//鼠标经过一级菜单，二级菜单动画下拉显示出来
var oSubNav = this.getElementsByTagName('ul')[0];
clearInterval(oSubNav.time);
if(oSubNav){
oSubNav.time = setInterval(function(){
oSubNav.style.height = oSubNav.offsetHeight + 20 + "px";
if(oSubNav.offsetHeight >= 120){
clearInterval(oSubNav.time);
}
},30);
}
}
//鼠标离开菜单，二级菜单动画收缩起来。
aLi[i].onmouseout = function(){
var oSubNav = this.getElementsByTagName('ul')[0];
clearInterval(oSubNav.time);
if(oSubNav){
oSubNav.time = setInterval(function(){
oSubNav.style.height = oSubNav.offsetHeight - 20 + "px";
if(oSubNav.offsetHeight == 0){
clearInterval(oSubNav.time);
}
},30);
}
}
}
}
查看全部 -
不懂·····
查看全部 -
background-position 用法: 1、background-position：0 0；等于background-position:left top；（左上角） 2、background-position：100% 100%；等于background-position:right bottom；（右下角） 3、background-position：-70px -40px；(以左上角为0 0点坐标，向左偏移70px,向上偏移40px) 4、background-position：70px 40px；(以左上角为0 0点坐标，向右偏移70px,向下偏移40px) 5、background-position：0 -30px;（以左上角为0 0点坐标，水平方向不动,向上偏移30px） 6、background-position：50% 50%；等于background-position：center center；（居中显示）查看全部
-
text-decoration:none; display:block; text-indent:10px;查看全部
-
<script>
window.onload=function(){
var aLi=document.getElementsByTagName('li');
for(var i=0; i<aLi.length; i++){
aLi[i].onmouseover=function(){
//鼠标经过一级菜单，二级菜单动画下拉显示出来
var oSubNav=this.getElementsByTagName('ul')[0];
if(oSubNav){
var This=oSubNav;
clearInterval(This.time);
This.time=setInterval(function(){
This.style.height=This.offsetHeight+16+"px";
if(This.offsetHeight>=120)
{
clearInterval(This.time);
}
},30)
}}
//鼠标离开菜单，二级菜单动画收缩起来。
aLi[i].onmouseout=function(){
var osubNav=this.getElementsByTagName('ul')[0];
if(osubNav){
var This=osubNav;
clearInterval(This.time);
This.time=setInterval(function(){
This.style.height=This.offsetHeight-16+"px";
if(This.offsetHeight<=0){
clearInterval(This.time)
}},30)
}
}
}
}
</script>
查看全部 -
1、有两个方法用于事件的切换，一个方法是循环切换hover()，另一个是切完为止toggle()。 2、$(selector).animate({params},speed,callback); 3、$(selector).stop(stopAll,goToEnd);查看全部
-
要使无序列表水平显示浮动float查看全部
-
不用js,在style最后加两行 ul>li ul{transition:height 0.3s;} ul>li:hover ul{height: 120px;} 也可以。查看全部
-
【background-position】图片定位。以图片的左上角顶点为原点，往下和右都为正，反之为负，查看全部
-
【float】放在内联中可以把内联变成块级使用查看全部
举报