设置[<div style =“”width:;“”onclick =“”]“to =”“width:=”“0;,=”“和=”“setting =”“it = “”to =“”=“”exact =“”width =“”of =“”=“”div =“”style?=“”

时间:2016-07-08 02:28:11

标签: html css

=“ “

设置

之间的区别是什么

<div style="width:;" onclick=" width:0 ,并将其设置为div样式的确切宽度?如果它们都具有相同的预期效果,那么您可以选择哪种效果?

想要的效果是,在开放空间中点击图像不会打开它。如果这就是您想要的,只需将 [ width: 0; ] 放在所有这些上就可以了吗?

两个例子: https://jsfiddle.net/vr3tn8o6/2/

50px <div style="width:50px;" onclick="

<div style="width:50px;" onclick="myObject=document.getElementById('myObj5h'); 
myObject.style.display='block'; this.style.display='none'">

<div style="display:block; cursor: pointer; width: 50px; height:50px; background-color:#00ffff; margin: 0;">
</div></div>

<div id="myObj5h" style="display: none;">

<div style="display:block;width: 50px; height:50px; background-color:red; ">
</div></div>

0 <div style="width:0;" onclick="

<div style="width:0;" onclick="myObject=document.getElementById('myObj5hf'); 
myObject.style.display='block'; this.style.display='none'">

<div style="display:block; cursor: pointer; width: 50px; height:50px; background-color:green; margin: 0;">
</div></div>

<div id="myObj5hf" style="display: none;">

<div style="display:block;width: 50px; height:50px; background-color:blue; ">
</div></div>

2 个答案:

答案 0 :(得分:0)

加入style属性:

`border: 1px solid red;` /* for debugging purposes */

您会看到父实际上有width: 0 ,但是孩子会溢出它。如果您将孩子设置为不溢出父,则所有人都将崩溃为虚无。

要禁止孩子溢出父母,请使用:

overflow: hidden;

查看this fiddle

答案 1 :(得分:0)

我们可以从您的代码中看到outer div设置为0px。但是,您的inner div设置为50px。如果您将inner div设置为0px,那么outer div将成为0px的唯一时间。 outer div永远不会小于其内容。

我希望这会有所帮助。