div 布局的主要手段
division 分割的
學習方法:
筆記案例 先看 再敲
語法 語句邏輯
用程式設計的方式解決生活中的事務
div 塊級標籤
獨佔一行 前後隔行
行級標籤 流式布局
csscascading style sheet
級聯(層疊) 樣式 表
通用性語法
《標籤名 style="屬性1:值1;...屬性n:值n;">
字典api
應用程式 介面
1、邊框類
border
: 5px solid red
;邊框寬度 樣式 顏色
solid 實線條
dashed 長條虛線
dotted 圓點虛線
border-top 上
border-right 右
border-botom 下
border-left 左
2、外邊距 margin
以上左為準
margin
: 50
px
100px
150px
200px
;上 右 下 左
aotu 居中
3、padding 內邊距
margin 不會改變div的面積大小
padding 會改變div的面積大小
4、文字
大小 加粗 斜體 字型
水平居中 垂直居中
顏色font-size color weight style family
5、背景顏色
background-color:gray;
background:url() no-repeat
6、定位 position
1、相對定位 relative
參照物:自己原來的位置
top y軸 left x軸
相對於原有位置的位移
並保留原有位置的占用
2、絕對定位 absolute
相對於父級(前提是父級發生了定位)的位移
否則找父的父 直到 body
不保留原有位置的占用
3、固定定位 fixed
相對於瀏覽器左上角的位移
4、static 不定位
7、文字
text-align line-height
行內元素 塊級元素和行內塊級元素
而標籤的屬性是可以轉換的 display inline 轉換為行內元素 display linline block 轉換為行內塊元素 display block 轉換為塊級元素。行內元素 無法設定寬高 margin和padding上下無效,只有左右有效果 總是和相鄰的行內元素在同一行上,預設排列方式...
行級元素 塊級元素
一.元素分類 行間元素 inline span,strong,em,a,del 塊級元素 block div,p,h1 h6,ul,ol,li,form,address 行塊級元素 inline block img 1.行間元素 內容決定元素所在位置,不可以通過css改變寬高。1234 設定的寬高無...
HTML 塊級元素 行級元素
塊狀元素排斥其他元素與其位於同一行,可以設定元素的寬 width 和高 height 塊級元素一般是其他元素的容器,可容納塊級元素和行內元素。常見的塊級元素有div,p h1 h6等。行內元素不可以設定寬 width 和高 height 但可以與其他行內元素位於同一行,行內元素內一般不可以包含塊級元...