简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首頁 > web前端 > html教學 > 主體

二列div固定宽度_html/css_WEB-ITnose

WBOY
發布： 2016-06-24 11:31:24
原創
1021 人瀏覽過

二列div固定宽度:
建议:尽可能的手写代码，可以有效的提高学习效率和深度。
在div+css布局中经常会用到两列固定宽度的div，一般用来对页面的功能区域的划分。之前已经介绍了一列div固定宽度，下面简单介绍一下如何让两列div并列显示，并且宽度是固定的。其实原理很简单，就是给两个div以固定的宽度，然后让他们并列显示。代码:

<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">.left {  width: 150px;  height: 50px;  background-color: green;  float: left;} .right {  width: 150px;  height: 50px;  background-color: blue;  float: left;}</style></head><body>  <div class="left">我是左边</div>  <div class="right">我是右边</div></body></html>
登入後複製

以上代码中使用float属性，让两个div在一行显示。点击可查看flaot属性介绍。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=4769

更多内容可以参阅:http://www.softwhy.com/divcss/

相關標籤：
二列div固定宽度
來源：php.cn
上一篇：TinyPNG-一个压缩PNG的神站_html/css_WEB-ITnose 下一篇：Foundation 6 – 先进的响应式的前端开发框架_html/css_WEB-ITnose
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
作者最新文章
最新問題
重新的標題為：固定的div列和剩餘的寬度 我正在嘗試建立一個5列佈局，其中所有列的高度都是瀏覽器視窗的全高度。除了中間列之外，其他列應該是固定的，當滾動瀏覽器/文件時不會移動。中間列將包含網站內容，並且會垂直溢出，所以在瀏...
來自於 2023-09-14 17:17:47
0
1
299
HTML 輸入標記意外移動 CSS 網格線 為了簡化我的問題，假設我有一個2x2CSS網格div。我使用網格模板來調整這4個單元格中的3個div（類別名稱：「btn」、「title」和「info」），如下程式碼片段所示。 （...
來自於 2023-09-14 00:31:55
0
2
229
在form/div標籤中動態新增表格 動態建立表出現在div標籤外部。我正在建立一個響應式註冊表單。輸入欄位取得使用者給定的表格所需的行數，並建立具有固定列數的所需行數。我創建了表格，但它沒有出現在我想要的位置。請大家...
來自於 2023-09-13 23:18:44
0
1
231
使用收縮包裝彈性盒包裝彈性項目，使其可以居中 我有一個帶有包裝內容的彈性盒。如何將彈性盒收縮到其內容上？我試圖解決的根本問題是將彈性盒居中。這張圖片描述了我的問題：我怎麼能實現這個目標？純CSS可以實現嗎？我事先不知道Flex...
來自於 2023-09-13 15:26:47
0
1
259
顯示 flex 佔用的寬度大於 div 上指定的寬度 div有一定的寬度，裡面的文字動態地來自API，並且有省略號樣式。我無法提供文字的寬度，因為文字是完全動態的並且不確定文字長度。下面是解釋該問題的程式碼。 body{backgro...
來自於 2023-09-11 18:37:38
0
1
304
相關專題
更多>
熱門推薦
熱門教學
更多>
相關教學
熱門推薦
最新課程
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！