a 转为块级元素--宽度的问题

青松100 2021-01-23 02:28:43

我想请教一下: # 31行 ,我没有给 a 和 a的父级宽度,而 a 已变成块级元素。---块级元素如果没有宽度,默认是和父级一样宽。
只有行内或行内块元素,宽度才会由内容撑开。---但是为啥这些 a 已是块级元素,还是宽度根据内容来撑开?

谢谢大佬。




<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}

.box1 {
float: left;
width: 209px;
height: 45px;
background-color: pink;
}

.box2 {
float: left;
}

li {
float: left;
list-style: none;
}

.box a {
display: block;
height: 45px;
line-height: 45px;
padding: 0 30px;
border: 1px solid #000;
background-color: skyblue;
}
</style>
</head>

<body>
<div class="box">
<div class="box1"></div>
<div class="box2">
<ul>
<li>
<a href="#">123</a>

</li>
<li>
<a href="#">123aaaa</a>

</li>
<li>
<a href="#">123bbbbb</a>

</li>
</ul>
</div>
</div>
</body>

</html>





...全文
371 4 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
x_Yaooo 2021-01-27
  • 打赏
  • 举报
回复
是因为你li标签浮动了
m0_68906799 2022-05-20
  • 举报
回复
@x_Yaooo 是因为li标签浮动了有行内元素特性a是li的子元素所以宽跟随父亲么
ZionHH 2021-01-25
  • 打赏
  • 举报
回复
因为浮动- -
sxysoft_csdn 2021-01-23
  • 打赏
  • 举报
回复
.box a { display: block; width: 500px; /* 块级元素需要设置宽 */ } 给你一个参考的地址 http://www.xinbiancheng.cn/css/

61,129

社区成员

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

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