有一个有趣的现象就是当为元素（不论之前是什么类型元素，display:none 除外）设置以下 2 个句之一：
1. position : absolute
2. float : left 或 float:right
简单来说，只要html代码中出现以上两句之一，元素的display显示类型就会自动变为以 display:inline-block（块状元素）的方式显示，当然就可以设置元素的 width 和 height 了，且默认宽度不占满父元素。
如下面的代码，小伙伴们都知道 a 标签是 行内元素 ，所以设置它的 width 是 没有效果的，但是设置为 position:absolute 以后，就可以了。
<div class="container"> <a href="#" title="">进入课程请单击这里</a> </div>
css代码
<style>
.container a{
position:absolute;
width:200px;
background:#ccc;
}
</style>想不起 display:inline-block 是做什么的小伙伴们，单击“元素分类--内联块状元素”可返回到前面小节进行复习。
练习
新建示例页面demo.html，示例代码如下
我来试试：下面我们来试试 float 有没有这种功能。
把示例页面中的代码的第 8 行改为 float:left ;看是否 width:200px 还起作用。
示例代码
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>隐性改变display类型</title>
<style>
.container a{
position:absolute;
width:200px;
background:#ccc;
}
</style>
</head>
<body>
<div class="container">
<a href="#" title="">进入课程请单击这里</a>
</div>
</body>
</html>
此文章本站原创，地址 https://www.vxzsk.com/1459.html
转载请注明出处！谢谢！
感觉本站内容不错，读后有收获？小额赞助,鼓励网站分享出更好的教程