您好,登錄后才能下訂單哦!
如何實現讓兩個DIV橫向排列,很多新手對此不是很清楚,為了幫助大家解決這個難題,下面小編將為大家詳細講解,有這方面需求的人可以來學習下,希望你能有所收獲。
如何定義讓兩個DIV橫向排列
兩個DIV橫向排列方法一:
一般情況,默認的DIV是寫一個換一行,那么如何定義兩個DIV橫向排列而不換行呢?
DIV默認的display屬性是block。所以每一個DIV都是新的一行,現在把display換成inline就不會換新行了。
< div styledivstyle="background-color:#ff0000;display:inline;">aaa</div> <divstyledivstyle="background-color:#ffff00;display:inline;">bbb</div>
兩個DIV橫向排列方法二:
這里使用float:right屬性。float做為CSS中的一個屬性定義元素向哪個方向浮動。float:right文本或圖像會移至父元素中的右側。
注意有寫情況float屬性必須配合width使用,否則失效。
<tdclasstdclass="bg10"> <divstyledivstyle="width:120px;float:right;">閱讀次數:9999</div> <divstyledivstyle="width:200px;float:right;">發表日期:2009-09-10</div> </td> .bg10{ background-image:url(../images/news_r6_c4.jpg); height:24px; line-height:24px; color:#939393; }
height:24px;和line-height:24px;高度一致,文字垂直居中。
看完上述內容是否對您有幫助呢?如果還想對相關知識有進一步的了解或閱讀更多相關文章,請關注億速云行業資訊頻道,感謝您對億速云的支持。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。