第四章 CSS布局與定位 上

2021-10-11 08:48:25 字數 1377 閱讀 1086

1.盒子模型

頁面元素大小

邊框與其他元素的距離

2.定位機制

文件流浮動定位

層定位

頁面上 區域、、導航、列表、段落,都可以是盒子

1.組成元素: 1.content內容

2.height高度

3.width寬度

4.padding內邊距

padding-left:40px;

padding-right:40px;

5.border邊框

border-left:40px;

border-right:40px;

6.margin外邊距

2.overflow屬性

hidden  超出部分不可見

scroll  顯示滾動條

auto  如果有超出部分,overflow屬性取值

3.border屬性

border-width:px、thin、medium、thick

border-style:dashed(橫線)、dotted(點組成)、double、solid(實線)

border-color:顏色

border:width、style、color

4.margin屬性

px、em等...

垂直方向合併,水平方向不合併

-水平居中 ,文字水平居中 text-align=center

-div水平居中  margin:0,auto

1.概述 有了盒子之後怎麼放在頁面之中?找到他的位置、確定他的位置。

2.分類 文件流、浮動定位、層定位

一.文件流定位

元素分類:block、inline、inline-block

元素型別轉換:display屬性

1.block元素特點(、、..、、、、)

獨佔一行

元素的height、width、margin、padding都可以設定

將元素顯示為block元素

a2.inline元素特點(、)

不單獨占用一行

width、height不可以設定

width就是它包含的文字或的寬度,不可改變

display:inline;

3.inline-block元素特點

不單獨占用一行

元素的height、width、margin、padding都可以設定 

例如:

鏈結1鏈結2

鏈結3

第四章 布局管理

2019 9 11 布局管理系統 這裡需要注意的是,在使用布局管理器時,會自動新增其父視窗。p78沒有看懂 設定部件 在布局管理器中的部件 大小 sizehint與minimunsizehint 大小策略屬性 sizepolicy 控制著部件在布局管理器中的大小和行為 窗體布局管理器的相關屬性 ql...

第四章 初識CSS

css樣式 行內樣式 使用style屬性引入css樣式 style屬性應用 內部樣式 css 寫在枯藤老樹昏鴉 小橋流水人家 古道西風瘦馬 夕陽西下 斷腸人在天涯 外部樣式 css 儲存在擴充套件名為.css的樣式表中 html檔案引用擴充套件名為.css的樣式表。one.css p 枯藤老樹昏鴉 ...

第四章 初始CSS

一.引入樣式 1.行內樣式表 2.內部樣式表 在head標籤裡面,title標籤下面 優點 方便在同頁面中修改樣式 缺點不利於在多頁面間共享復用 及維護,對內容與樣式的分離也不夠徹底 3.外部樣式表 嵌入式匯入式嵌入式和匯入式的區別 1.標籤屬於xhtml,import是屬於css2.1 2.使用鏈...