>  기사  >  웹 프론트엔드  >  这样的导航栏,这么样写呢?_html/css_WEB-ITnose

这样的导航栏,这么样写呢?_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-24 12:07:511063검색

初始的时候,是这样的,
鼠标指针移动到上面的时候,变成这样
后面那种样式怎么写呢?好像用的是box-shadow.求具体的代码


回复讨论(解决方案)

这个吧,用js的 焦点事件~~当鼠标放上去的时候用  function函数来循环{  if判断如果(){放上去的时候换图片
}else{ 否则不见} }
其实这个2级导航用css也是可以做的  但是效果没有javascript好看
我是想要放上去后的css效果,js的会做

蓝色部分可以是个div  字是div里的span  当移上去的时候设置span的border为黑色   移出去border的color为透明  
类似这样试试
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



无标题文档




123



蓝色部分可以是个div  字是div里的span  当移上去的时候设置span的border为黑色   移出去border的color为透明  
类似这样试试
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



无标题文档




123



只用border-color是不可能做出来的,我想要的是做成跟图中一模一样的效果,但是试了好多组box-shadow的值都不一样

那你把要什么效果说出来啊  
你给的两个图的那个效果可以的

那你把要什么效果说出来啊  
你给的两个图的那个效果可以的
就是把边框做成嵌入的效果,应该是用box-shadow,但是试了几组值都不对

box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4) inset, 0px 1px 0px rgba(255, 255, 255, 0.1);
text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.796), 0px 0px 10px rgba(255, 255, 255, 0.298);

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.