Home  >  Article  >  Web Front-end  >  隐性改变display类型_html/css_WEB-ITnose

隐性改变display类型_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:14:56964browse

有一个有趣的现象就是当为元素(不论之前是什么类型元素,display:none 除外)设置以下 2 个句之一:

position : absolute
float : left 或 float:right
元素会自动变为以 display:inline-block 的方式显示,当然就可以设置元素的 width 和 height 了且默认宽度不占满父元素。

如下面的代码,小伙伴们都知道 a 标签是行内元素,所以设置它的 width 是 没有效果的,但是设置为 position:absolute 以后,就可以了。

 1 html代码: 2 <div class="container"> 3    <a href="#" title="">进入课程请单击这里</a> 4 </div> 5  6 css代码 7 <style> 8    .container a{ 9         position:absolute;10         width:200px;11         background:#ccc;12    }13 </style>

 

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn