Home  >  Article  >  Web Front-end  >  这样的导航栏,这么样写呢?_html/css_WEB-ITnose

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

WBOY
WBOYOriginal
2016-06-24 12:07:511064browse

初始的时候,是这样的,
鼠标指针移动到上面的时候,变成这样
后面那种样式怎么写呢?好像用的是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);

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn