61,114
社区成员
发帖
与我相关
我的任务
分享小白求教，css样式浮动不会紧贴左边部分是为什么
<html>
<head>
<title>导航条练习</title>
<style type="text/css">
.*{
margin:0;
padding:0;
}
.nav{
list-style:none;
background-color:PowderBlue;
width:1000px;
margin:50px auto;
}
.nav li{
float:left;
width:25%;
}
.nav li a{
display:block;
width:100%;
margin:0 auto;
padding:5px 0;
text-align:center;
text-decoration:none;
}
a:hover{
background-color:Coral;
}
.clearfix:after{
content:"";
display:block;
clear:both;
}
</style>
</head>
<body>
<ul class="nav clearfix">
<li><a href=#>首页</a>
<li><a href=#>我们</a>
<li><a href=#>刷新</a>
<li><a href=#>联系</a>
</ul>
</body>
<html>
...全文
请发表友善的回复…
发表回复
dai050322 2020-03-10
- 打赏
- 举报
会不会是因为body标签的内边距或外边距？可以试试
qq_44749740 2020-03-09
- 打赏
- 举报
插眼 在线蹲一个大佬
EY鳄鱼 2020-03-09
- 打赏
- 举报
前面那个.*{margin:0;
padding:0;}不是会全局取消默认布局吗，那个ul为什么没有取消呢？
[/quote]哥，前面有个小点[/quote]
好的😄感谢感谢
[/quote]哥，前面有个小点[/quote]
好的😄感谢感谢
zhtoad 2020-03-09
- 打赏
- 举报
是不是弄一个 right：0px
这样不行吗？
m0_45698205 2020-03-09
- 打赏
- 举报
设有关系S、SC、C，
S(S#,SNAME,AGE,SEX) 例：（001,'李强',23,'男'）
SC(S#,C#,SCORE) 例：（003,'C1',83）
C(C#,CNAME,TEACHER) 例：（'C1','数据库原理','王华'）
1).用关系代数检索既选修了C1课程，又选修了C2课程的学生学号（S#）
2).用关系代数检索选修了“程军”老师所授课程之一的学生姓名。
求求求
Gmw_ 2020-03-09
- 打赏
- 举报
前面那个.*{margin:0;
padding:0;}不是会全局取消默认布局吗，那个ul为什么没有取消呢？[/quote]哥，前面有个小点
[/quote]哥，前面有个小点
jiangzhixiao 2020-03-08
- 打赏
- 举报
推荐直接上手flex或者gird布局
EY鳄鱼 2020-03-08
- 打赏
- 举报
好的，去试试，非常感谢你😀😀
Ai—yaya 2020-03-08
- 打赏
- 举报
你可以在浏览器右击，检查。然后找到首页那一个盒子的设置。一般可以通过改变margin 和padding开进行位置移动，这也是一个比较小白的做法。
在浏览器活动面板上可以随意调数据，知道你认为可以了，再回到环境软件（DW或者是Sublime）内进行修改
EY鳄鱼 2020-03-07
- 打赏
- 举报
感谢感谢，懂了，
silence cc 2020-03-07
- 打赏
- 举报
通用标签*前面没有符号.
EY鳄鱼 2020-03-07
- 打赏
- 举报
非常感谢大佬，一时粗心，嘿嘿，我明白了
李国庆❀ 2020-03-07
- 打赏
- 举报
样式里面的通配符（*）前面不应该有（.），这样就去不了<ul>标签的内边距
EY鳄鱼 2020-03-07
- 打赏
- 举报
非常感谢大佬😊明白了
侬依呢 2020-03-07
- 打赏
- 举报
<html>
<head>
<title>导航条练习</title>
<style type="text/css">
.*{
margin:0;
padding:0;
}
.nav{
list-style:none;
background-color:orangered;
width:1000px;
margin:50px auto;
float:left;
}
.nav li{
float:left;
width:25%;
}
.nav li a{
display:block;
width:100%;
margin:0 auto;
padding:5px 0;
text-align:center;
text-decoration:none;
}
a:hover{
background-color:Coral;
}
.clearfix:after{
content:"";
display:block;
clear:both;
}
</style>
</head>
<body>
<ul class="nav clearfix">
<li><a href=#>a</a>
<li><a href=#>b</a>
<li><a href=#>c</a>
<li><a href=#>d</a>
</ul>
</body>
<html>
稍微修改了一下你的代码，只需要在nav选择器中添加属性float:left;就可以解决了
EY鳄鱼 2020-03-06
- 打赏
- 举报
好的，感谢感谢😊
silence cc 2020-03-06
- 打赏
- 举报
把通用选择器*前面的.符号去掉
EY鳄鱼 2020-03-06
- 打赏
- 举报
非常感谢，我懂了，嘿嘿
「已注销」 2020-03-06
- 打赏
- 举报
<html>
<head>
<title>导航条练习</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
a {
text-decoration: none;
}
.nav {
list-style: none;
width: 1000px;
margin: 50px auto;
display: flex;
justify-content: space-between;
}
.item {
background-color: PowderBlue;
text-align: center;
padding: 5px;
width: 25%;
}
.item:hover {
background-color: rgb(190, 226, 89);
}
</style>
</head>
<body>
<ul class="nav">
<li class="item"><a href=#>首页</a></li>
<li class="item"><a href=#>我们</a></li>
<li class="item"><a href=#>刷新</a></li>
<li class="item"><a href=#>联系</a></li>
</ul>
</body>
<html>EY鳄鱼 2020-03-06
- 打赏
- 举报
确实加上了这个就没问题了，感谢大佬[/quote]这是什么鬼。。。
全局取消样式，直接星号，不要带点[/quote]
啊，是吗，去掉点也可以，我看的那个视频里带点了，2016年的了，可能比较老了，这是新的吗
[/quote]这是什么鬼。。。
全局取消样式，直接星号，不要带点[/quote]
啊，是吗，去掉点也可以，我看的那个视频里带点了，2016年的了，可能比较老了，这是新的吗加载更多回复（9）
