<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>tab栏切换</title>
<script src="jquery-1.11.1.min.js"></script>
<style>
*{/*去除页面原有边距*/
margin: 0;
padding: 0;
}
.wrapper{/*定义标题盒子*/
width: 400px;
height: 35px;
margin: 100px auto;
border: 1px solid red;
}
.tab-item{/*标题栏设置*/
float:left;
display: block;
font-size: 20px;/*字体大小*/
background-color: white;
}
a:hover{/*鼠标悬停变色*/
background-color:aqua;
}
ul{/*去除小圆点*/
list-style: none;
}
a{
text-decoration: none;/*去除下划线*/
}
</style>
</head>
<body>
<div class="wrapper">
<ul class="tab">
<li class="tab-item"><a href="#">国际大牌</a></li>
<li class="tab-item"><a href="#">国妆名牌</a></li>
<li class="tab-item"><a href="#">清洁用品</a></li>
<li class="tab-item"><a href="#">男士精品</a></li>
</ul>
</div>
</body>
</html>
为什么我定义的盒子width为400,height为35,显示的却是502,46呢?
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
2条回答 默认 最新
- it_lin_web 2019-05-09 20:06关注
你的盒子css代码加上这句box-sizing: border-box;
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 微信小程序协议怎么写
- ¥15 c语言怎么用printf(“\b \b”)与getch()实现黑框里写入与删除?
- ¥20 怎么用dlib库的算法识别小麦病虫害
- ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
- ¥15 java写代码遇到问题,求帮助
- ¥15 uniapp uview http 如何实现统一的请求异常信息提示?
- ¥15 有了解d3和topogram.js库的吗?有偿请教
- ¥100 任意维数的K均值聚类
- ¥15 stamps做sbas-insar,时序沉降图怎么画
- ¥15 买了个传感器,根据商家发的代码和步骤使用但是代码报错了不会改,有没有人可以看看