CSS3背景制作导航菜单综合练习题，十天精通CSS3教程-慕课网

CSS3背景制作导航菜单综合练习题

小伙伴们，根据所学知识，使用CSS3实现下图的导航菜单效果

任务

1、制作导航圆角

提示：使用border-radius实现圆角

2、制作导航立体风格

提示：使用box-shadow实现立体风格

3、制作导航分隔线

提示：使用渐变与伪元素制作

4、删除第一个和最后一个导航分隔线

提示：使用伪元素删除第一个和最后一个分隔线

?不会了怎么办

问答
评论
笔记
资料下载
代码

全部精华我要发布

感觉好像白学了

最新回答 / yuanpinghua

伪元素（pseudo-elements）是 CSS 的一种机制，允许你通过 CSS 选择器向某些元素的特定部分添加样式。它们表示元素的特定部分或状态，并允许你在不改变 HTML 结构的情况下对其进行样式处理。常见...

1 回答 374 浏览

2023-12-26

不了解这一行代码的用处

+ 我来回答回答最高可+2积分

1 回答 816 浏览

2022-04-15

麻烦问一下，为什么我不能去掉第一个分割线呢

最新回答 / 李_十一

<...图片...>你这两个地方一致就好了，要不都是after,要不都是before

3 回答 835 浏览

2022-04-20

linear-gradient

最新回答 / 慕瓜606597

50%为透明参数，取值在0和1直接，不可为负值哦?

1 回答 1167 浏览

2020-01-31

怎么使用伪元素制作分割线啊，没学过伪元素啊，

最新回答 / 恰逢暮雪

.nav li:after{ content: ''; position: absolute; height:20px; width: 1px; top:0; bottom:0; left: 0; margin: auto auto; background: #999; }

2 回答 1976 浏览

2021-01-18

分割线用伪元素做不会觉得太短了吗

最新回答 / 恰逢暮雪

.nav li:after{ content: ''; position: absolute; height:20px; width: 1px; top:0; bottom:0; left: 0; margin: auto auto; background: #999; }

2 回答 1003 浏览

2021-01-18

connent:" "是什么意思？为什么要加这句话，不是很理解

已采纳回答 / 慕斯3108201

connent你可以理解为让before/after生效，没有connent:""你设置的样式不会添加进去，connent:""的引号内可以输入你想添加的文本

2 回答 1994 浏览

2019-09-21

太超前的作业了吧

最新回答 / qq_慕慕9353456

有一个基础的css，你再找找~~！

1 回答 805 浏览

2021-06-04

content:"";

最新回答 / 笨鸟快快飞

你想问什么

1 回答 854 浏览

2019-05-14

请问大神right：0可以删除吗？还有 background: linear-gradient(top, #ff625a, #9e3e3a 50%, #ff625a);top前面不用加to吗？

最新回答 / 慕瓜1216469

right=0不能删除，删除了，你通过伪元素添加的这个空格位置就会被默认紧贴（如果是:before就紧贴下一个元素的前面，：after则相反）。position：absolute是相对于该元素的父元素来定位的，所以right=0实际上是把这个空格位置紧贴在它的父元素也就是<li>的脸上，所以最后前后贴脸的两个空格才能重合起来。至于top加不加to都行，事实证明它可以不加to.

1 回答 1538 浏览

2019-05-16

怎么把ul(nav)的宽度平均分配给每个li，使每个li的宽度一样？

最新回答 / 慕田峪4056946

ul宽100%，li宽calc((100%)/li个数)

1 回答 4890 浏览

2019-05-06

伪元素设置 | ，使其居中

已采纳回答 / _Doogie

.nav li:after{ position:absolute; content:"|"; right:0; top:0; color:#fff; text-shadow:0 0 0 rgba(0,0,0,.5);}/*删除第一项和最后一项导航分隔线...

6 回答 3457 浏览

2022-07-28

为什么最后一项导航分割线删除不了呢

+ 我来回答回答最高可+2积分

4 回答 1316 浏览

2022-06-03

transition

已采纳回答 / 柯kk

CSS3的过度transition属性是一个复合属性，主要包括以下几个子属性：

transition-property:指定过渡或动态模拟的CSS属性

transition-duration:指定完成过渡所需的时间

transition-timing-function:指...

1 回答 1628 浏览

2019-02-15

输入颜色问题

已采纳回答 / qq_慕前端5597202

去看看有没有相应的插件

1 回答 1190 浏览

2019-05-30

全部我要发布

最热最新

只看我的

制作导航菜单源码立即下载

5-5 CSS3背景制作导航菜单综合练习题