⑴ 用js寫,當一個div display:inline的時候另一個div也display:inline,求大神

if(getElementById("div1").display=="inline")
{
		getElementById("div2").display="inline";
}

⑵ 請問在CSS中關於display:inline的理解

display:inline;就是將本來是塊級的元素顯示為內嵌的元素,比如div是一個塊級元素,設置了display:inline之後,專就會跟其他屬元素在同級顯示了
例:
text1
<div>text2</div>
這里的text1跟text2是分開在兩行顯示的

text
<div style="display:inline;">text2</div>
這里的text1和text2則是在同一行顯示的

⑶ css中display:inline-block

很多時候我們必須使一些塊元素並排顯示,一般想到的是必須使用浮動,但是塊元素浮動給邊距(margin)的時候在IE下會出現加倍的BUG,所以很多時候不得不把這個塊元素套在一個內聯元素裡面,然後給內聯元素浮動和邊距。今天看到了懌飛、秦歌和烏龍茶關於display:inline-block的文章,很不錯,綜合一下,記錄下來。

display:inline-block
簡單來說就是將對象呈遞為內聯對象,但是對象的內容作為塊對象呈遞。旁邊的內聯對象會被呈遞在同一行內,允許空格。但是這個屬性目前不是所有的瀏覽器都支持,只有Opera和Safari支持,FireFox3和IE8據說將會支持,Firefox2和IE使用特殊辦法可以實現這種效果,下面就來探討一下

在Firefox2中有-moz-inline-stack和-moz-inline-box實現,但是這兩個私有屬性在某些情況下都會有異常,具體如下:
1、display:-moz-inline-stack
「當它所應用的外包裝器(wrapper)的display為inline的時候,它所包含的a或button將無法點擊或無法選取,需要通過position:relative還hack掉這個bug」--烏龍茶
2、display:-moz-inline-box
使用這一屬性後,text-align就會出問題,必須使用Firefox的私有屬性 -moz-box-align來解決
所以,建議不要使用-moz-inline-box,還是使用-moz-inline-stack

在IE(以下IE8除外)下,如果對內聯元素,比如a或span元素,使用inline-block屬性是有效的,似乎IE是支持的,其實是觸發了IE的layout,從而擁有了inline-block屬性的表症。這樣我們就有了一種在IE下實現display:inline-block效果的兩種方法:

1、先用display:inline-block屬性觸發塊元素,然後再定義display:inline,讓塊元素呈遞為內聯對象(原理:這是IE的一個經典bug,如果先定義了display:inline-block,然後再設置display回inline或block,layout不會消失),代碼如下:
div {display:inline-block;}
div {display:inline;}

2、直接讓塊元素設置為內聯對象(display:inline),然後通過zoom:1觸發塊元素的layout,代碼如下:
div {display:inline; zoom:1;}

那麼為了能夠讓所有瀏覽器支持display:inline-block,綜合一下,最終的實現代碼如下(參考懌飛:模擬兼容性的 inline-block 屬性):

display:inline-block; /*一方面Firefox3 beta、IE8 beta、Opera、Safari 支持,另一方面下觸發IE下inline 元素的 hasLayout*/

display:-moz-inline-stack; /* Firefox 的私有屬性,需要時還必須用到position:relative解決上面提到的bug */

zoom:1; /*同樣是IE 下觸發 hasLayout*/
*display:inline; /*一旦IE 下觸發了 hasLayout,設置 block 元素為 inline 會使 display:inline 效果與 display:inline-block 相似*/

/*擴展一下一些其他可能用到的屬性*/
text-indent:-9999px;
*text-indent:0;
font-size:0;
line-height:0; /* 如需隱藏文字,可用這四個屬性 */
/*另外上面隱藏文字,還可以用更簡化的方法:line-height:超級大值;font-size:0; */

overflow:hidden; /* 隱藏溢出的內容 */

vertical-align:middle; /* 行內垂直居中,針對 Opera 比較大的偏離 */

width:?px; /*?為任意非auto值*/
height:?px; /*?為任意非auto值*/

html中disy:inline什麼作用

是display:inline;

通常用用法:

display:none;/*隱藏*/
display:block;/*塊狀顯示*/
display:inline;/*行內專顯示,內聯屬*/
display:table;/*表格形式*/
參考:http://www.hi-docs.com/css/display.html

⑸ css中內聯元素(inline)與塊狀元素(block)的區別

最簡單區分二來者的方法是自 inline不會獨佔一行 block會單獨佔用一行的空間

css中 width與height只對block有效 對inline無效

css中 margin與padding只對inline的左右生效 上下無效
二者轉換可以用 display:inline display:block

⑹ CSS中的display: *inline和display: inline有什麼區別

這兩個寫法沒有太大的區別,是為了瀏覽器兼容性而寫的。正如你所說得,前者是為了讓回IE識別,而且是為了讓答IE6和IE7來識別。
而後者的寫法是瀏覽器都可以識別的。
至於其他用途沒有了。這也叫css hack寫法。
如果幫到你,請點贊!

⑺ css裡面display:inline和style="display:none"

display:inline--默認。此元素會被顯示為內聯元素,元素前後沒有換行符。
display:none--此元素不會被顯示。

⑻ 前端 inline元素的特點,哪些元素屬於inline元素

不能設置寬高啊,多個元素能夠處於同一行,縱向的margin,padding設置無效等,具體去看HTML5學堂吧,都是前端干貨。

⑼ div display:inline 不起作用,這么弄望大神指點

我幫你改了一下

<html >
<head>
<title>默認頁</title>

</head>
<body >
<div style="background-color:#FFC8B4; width:1000px; height:500px; border:1px solid #FFC8B4;margin:20px auto;height:500px;">
<div style="background-color:#FF7744;width:1000px; height:75px;">
logo
</div>
<div style="background-color:#00DD77;width:1000px; height:75px;">
導航
</div>
<div style="background-color:#0088A8;width:300px; height:350px;">左</div>
<div style="background-color:#AAFFFF;width:700px; height:350px;display:inline;">

//這里的不起作用
<div style="background-color:#E63F00;width:300px; height:70px;float:left;">
右上
</div>
<div style="background-color:#AA0000;width:300px; height:70px;float:left;">
右下
</div>
</div>

</div>
</body>
</html>

主要改了這些地方

<div style="background-color:#E63F00;width:300px; height:70px;float:left;">
右上
</div>
<div style="background-color:#AA0000;width:300px; height:70px;float:left;">
右下
</div>

⑽ css中inline-block和inline有什麼區別

這樣先講內聯元素和塊級元素:
內聯元素是不可以控制寬和高、margin等;專並且在同一行顯示,不屬換行。
塊級元素時可以控制寬和高、margin等,並且會換行。

inline:使用此屬性後,元素會被顯示為內聯元素,元素則不會換行。
block:使用此屬性後,元素會被現實為塊級元素,元素會進行換行。
inline-block:是使元素以塊級元素的形式呈現在行內。意思就是說,讓這個元素顯示在同一行不換行,但是又可以控制高度和寬度,這相當於內斂元素的增強。

要注意的是IE6 不支持inline-block