导航倾斜样式如何用CSS实现

u010924055 2014-09-20 10:38:13

实现上面图的效果而且不能用绝对定位,因为都是调用的原因。。。求大神指点方法。。。
...全文
670 29 打赏 收藏 转发到动态 举报
写回复
用AI写文章
29 条回复
切换为时间正序
请发表友善的回复…
发表回复
  • 打赏
  • 举报
回复
看了大神些的回复。。。。其实觉得如果只是想要那种效果的话,可以直接作图嘛,用hover来实现鼠标滑过的效果嘛!!!再加上上面大神 说的半透明,用z-index把几个div重叠起来!!!(我也是新手,所以我的表述可能有问题,
Panda跳舞 2014-09-28
  • 打赏
  • 举报
回复
引用 25 楼 KK3K2005 的回复:
引用 23 楼 u010924055 的回复:
[quote=引用 17 楼 KK3K2005 的回复:] [quote=引用 14 楼 u010924055 的回复:] [quote=引用 5 楼 KK3K2005 的回复:] 最后加个 斜角图片
不行,这个是高亮特效鼠标放上去才会显示的。用hover可以实现么
用hover+图片 怎么不能实现?[/quote]能不能指点下,用hover+背景图,主要问题还是重叠一起而且不能定位[/quote] 我觉得 主要问题是 你被倾斜 诱惑了 你就看成一个 正方形的区域 现在鼠标上去 你就显示一个正方形 带颜色的 div 看看行不 以后在换背景 位置在调整下[/quote] 你还是没看我说的,正方形的区域想重叠,就必须用绝对定位,现在的问题是都是调用的,一句代码调出来的导航,实现重叠只能写JS..
Panda跳舞 2014-09-28
  • 打赏
  • 举报
回复
引用 26 楼 xueweidng 的回复:
这么多大神都没有帮上呵呵,跟我做的个黄岛论坛一样,还得靠自己解决
后来你实现了没,上面那些伪大神根本没仔细我的问题和图样,哎
Panda跳舞 2014-09-27
  • 打赏
  • 举报
回复
引用 21 楼 a88532698 的回复:
1.用负的margin-left去对齐,样子看起来差不多,不过文字要另去定一下位置,hover出背景的触发也总觉得怪怪的 2.把左右分开,hover的时候直接去平移左边的背景图去对齐 3.用css3去转换nav的形状,不过老版本估计只能显示方的了
你这个还是不太一样,上面的倾斜角没有超过第二个DIV层,那样的话用边框特性border就能实现
Panda跳舞 2014-09-27
  • 打赏
  • 举报
回复
引用 17 楼 KK3K2005 的回复:
引用 14 楼 u010924055 的回复:
[quote=引用 5 楼 KK3K2005 的回复:] 最后加个 斜角图片
不行,这个是高亮特效鼠标放上去才会显示的。用hover可以实现么
用hover+图片 怎么不能实现?[/quote]能不能指点下,用hover+背景图,主要问题还是重叠一起而且不能定位
Panda跳舞 2014-09-27
  • 打赏
  • 举报
回复
引用 19 楼 u010782227 的回复:
这个效果是多个div重叠在一起,然后设置每个div的样式为那样平行四边形什么的,通过设置opacity实现透明效果,如果要让他悬浮,可以设置position,fixed
不能用定位的,因为这个是织梦调用的导航,如果要定位就要用JS。。。。让DIV重叠在一起不用定位实在不懂
xueweidng 2014-09-27
  • 打赏
  • 举报
回复
这么多大神都没有帮上呵呵,跟我做的个黄岛论坛一样,还得靠自己解决
KK3K2005 2014-09-27
  • 打赏
  • 举报
回复
引用 23 楼 u010924055 的回复:
引用 17 楼 KK3K2005 的回复:
[quote=引用 14 楼 u010924055 的回复:] [quote=引用 5 楼 KK3K2005 的回复:] 最后加个 斜角图片
不行,这个是高亮特效鼠标放上去才会显示的。用hover可以实现么
用hover+图片 怎么不能实现?[/quote]能不能指点下,用hover+背景图,主要问题还是重叠一起而且不能定位[/quote] 我觉得 主要问题是 你被倾斜 诱惑了 你就看成一个 正方形的区域 现在鼠标上去 你就显示一个正方形 带颜色的 div 看看行不 以后在换背景 位置在调整下
515445681 2014-09-22
  • 打赏
  • 举报
回复
具体的你也没说明白,如果还没解决加下我QQ讨论下吧,,515445681
515445681 2014-09-22
  • 打赏
  • 举报
回复
这个效果是多个div重叠在一起,然后设置每个div的样式为那样平行四边形什么的,通过设置opacity实现透明效果,如果要让他悬浮,可以设置position,fixed
515445681 2014-09-22
  • 打赏
  • 举报
回复
css3 可以写
KK3K2005 2014-09-22
  • 打赏
  • 举报
回复
引用 14 楼 u010924055 的回复:
引用 5 楼 KK3K2005 的回复:
最后加个 斜角图片
不行,这个是高亮特效鼠标放上去才会显示的。用hover可以实现么
用hover+图片 怎么不能实现?
Panda跳舞 2014-09-22
  • 打赏
  • 举报
回复
引用 15 楼 net_lover 的回复:
纯css实现比较困难,使用js很简单实现、
JS放个代码看看呀
a88532698 2014-09-22
  • 打赏
  • 举报
回复
1.用负的margin-left去对齐,样子看起来差不多,不过文字要另去定一下位置,hover出背景的触发也总觉得怪怪的

2.把左右分开,hover的时候直接去平移左边的背景图去对齐
3.用css3去转换nav的形状,不过老版本估计只能显示方的了
孟子E章 2014-09-21
  • 打赏
  • 举报
回复
纯css实现比较困难,使用js很简单实现、
Panda跳舞 2014-09-20
  • 打赏
  • 举报
回复
引用 1 楼 xmt1139057136 的回复:
什么意思,怎么没有 看明白呢!!
切PNG的图还是用CSS3背景实现啊?
Panda跳舞 2014-09-20
  • 打赏
  • 举报
回复
引用 1 楼 xmt1139057136 的回复:
什么意思,怎么没有 看明白呢!!
就是上面的高亮特效,有个倾斜样式,这个地方的样式不会搞了
业余草 2014-09-20
  • 打赏
  • 举报
回复
什么意思,怎么没有 看明白呢!!
Panda跳舞 2014-09-20
  • 打赏
  • 举报
回复
引用 5 楼 KK3K2005 的回复:
最后加个 斜角图片
不行,这个是高亮特效鼠标放上去才会显示的。用hover可以实现么
Panda跳舞 2014-09-20
  • 打赏
  • 举报
回复
引用 4 楼 xmt1139057136 的回复:
CSS3背景实现啊,放假时间,论坛人少
求方法,能兼容IE的
加载更多回复(9)

61,115

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧