前端複習 CSS布局1 右定寬左自適應

2021-07-22 01:24:15 字數 352 閱讀 3729

和俊伯約定,此後大家都挖一口井,俊伯的任務是每天讀一點書,我推薦了《百年孤獨》,小傢伙很認真,經常督促我,還質疑我,問如和監管我,計畫到了第三天,我終於想到了,寫學習部落格。馬上要找工作了,基礎知識都過一遍,以此開篇。

要求:content盒子是自適應寬度(在左邊),sidebar是定寬的(在右邊);

css樣式

#content

#sidebar

content正常放(不浮動,不定位),讓其正常處於文件流!僅僅在其右側設定margin-right : ( sidebar的寬度),虛位以待sidebar;

sidebar右浮動(float:right);

一定一自適應 左定寬,右自適應 左自適應,右定寬

兩個div,一側定寬一側自適應,涉及的原理 div有個預設的屬性,即如果不設定寬度,那他會自動填滿父標籤的寬度 也可以說是塊級元素的屬性 自適應區不能設定浮動,因為一旦浮動就不是塊級元素了,而是行內塊,失去了塊級元素的預設屬性 position absolute 絕對定位不受流式布局影響 calc ...

CSS布局 左定寬度右自適應寬度並且等高布局

今天有位朋友一早從妙味課堂轉來乙個有關於css布局的面試題,需要解決,花了點時間寫了幾個demo,放上來與大家分享受。那麼我們在看demo之前一起先來看看這個面試題的具體要求吧 左側固定寬,右側自適應螢幕寬 左右兩列,等高布局 左右兩列要求有最小高度,例如 200px 當內容超出200時,會自動以等...

關於某題左列定寬右列寬度自適應布局的學習

今天群裡有人做題發了一道題,由於最近在學習flex布局,就不禁研究了起來.題目如下 已知html結構如下,以下哪些css可以實現左列定寬 100px 右列寬度自適應的布局?左列 右列 a parent.left.right b parent.left.right c parent.left.righ...