隐性改变display类型

Posted Rinpe

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了隐性改变display类型相关的知识,希望对你有一定的参考价值。

有一个有趣的现象就是当为元素(不论之前是什么类型元素,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类型的主要内容,如果未能解决你的问题,请参考以下文章

行内和块状元素水平居中与单行或多行文本垂直居中及隐性改变display类型

我所理解的javascript的隐性类型转化。

javascript 隐性类型转换步骤

RTL基本知识:编译命令指定隐性线网类型

RTL基本知识:线网的隐性声明

css常用代码片段 (更新中)