css3: dl中如何讓dr和dt視覺上顯示到同一行?
問題描述
用dl來實現(xiàn)如圖京東二級導(dǎo)航,但是自己dr跟dd總排不到一行.做了個demo觀察了一下 ,發(fā)現(xiàn)dr跟dd的浮動十分特殊,見圖(已將dd的margin設(shè)為0).普通p在同一方向float效果如兩個灰色方塊.而dr和dd有重疊部分而且是下邊框?qū)R.那么請問該該如何實現(xiàn)?
CSS如下
dl, dr, dd {display: block; } dl {overflow: hidden;width: 400px;background-color: #cc6666; } dr {width: 60px;float: left;background-color: #66cc66; } dd {margin: 0;padding: 0;float: left;width: 300px;background-color: rgba(0, 0, 0, .2); } .floatL {width: 100px;height: 100px;margin: 4px;float: left;background-color: #666; }
多謝1L指正.啊!!我的眼睛!!
問題解答
回答1:有dr標簽?dl dt dd吧...把dt和dd設(shè)為inline-block不就行了.
相關(guān)文章:
1. dockerfile - [docker build image失敗- npm install]2. 關(guān)docker hub上有些鏡像的tag被標記““This image has vulnerabilities””3. javascript - 怎么實現(xiàn)讓 div 里面的 img 元素 中心居中, 如下示例圖4. Docker for Mac 創(chuàng)建的dnsmasq容器連不上/不工作的問題5. java如何高效讀寫10G以上大文件6. docker不顯示端口映射呢?7. javascript - vue-router怎么不能實現(xiàn)跳轉(zhuǎn)呢8. javascript - IOS微信audio標簽不能通過touchend播放9. dockerfile - 我用docker build的時候出現(xiàn)下邊問題 麻煩幫我看一下10. 在windows下安裝docker Toolbox 啟動Docker Quickstart Terminal 失敗!
![dockerfile - [docker build image失敗- npm install]](https://m.cgvv.com.cn/attached/image/news/202311/1028105a80.png)