这里右侧的a
需要设置一段代码：使链接的显示为行内块级元素,让a链接为一个整体,就不会出现折行问题,
需要设置一段代码 : 使a链接的显示
block : 块级元素(可以设置宽高,一个块级)
inline-block: 行内块级元素()
设置后效果:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<style>
*{
margin:0;
padding:0;
}
#div1{
width: 100px;
height: 80px;
background:red;
float: left;
}
#div2{
width: 250px;
height:80px;
background:yellow;
float: left;
}
#div2 a{
/*display: inline-block;*/
}
</style>
</head>
<body>
<div>
<div id="div1">
<h3>企业用酒</h3>
</div>
<div id="div2">
<p>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
<a href="">商务用酒</a>
</p>
</div>
</div>
<script>
</script>
</body>
</html>
扫一扫
2221
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
