为什么给链接a加边框加不上
时间：03-18来源：作者：点击数：
因为a是行内元素，要把他变成块状元素才行！
我们在日常敲代码中经常会遇到给链接a加边框加不上的情况！
按道理说是没有问题的，但为什么会加不上呢！
我也是在网上研究了好久才明白的。
在实际网页开发中，我们不是直接给一个图片的，而是给这个图片一个链接，用户一点击图片就可以链接到商品的目标地址。
<a href="#"><img src="#" alt=""> </a>
但是图片是一个块状盒子，如果直接给链接a设置边框，是行不通的。
<style>
.box {
margin: 0 auto;
width: 200px;
height: 100px;
background-color: pink;
}
a {
display: block;
border: 10px solid #ccc;
}
.w {
width: 300px;
height: 200px;
margin: 0 auto;
}
img {
width: 100%;
}
</style>
</head>
<body>
<div class="w">
<a href="#"><img src="2.jpg" alt=""></div></a>
</div>
只有给a加上 display：block 之后才能正常显示边框！
方便获取更多学习、工作、生活信息请关注本站微信公众号
上一篇:浅谈web项目的跨域
下一篇:CSS样式表初始化代码
湘公网安备 43102202000103号