HTML基礎複習4

2022-06-18 13:00:13 字數 2015 閱讀 9016

css的應用

模組的邊框

設定邊框樣式

border-style::如果是乙個值那麼表示四個邊的樣式都一樣;如果是兩個值那麼第乙個值代表上下,第二個值代表左右;如果是三個值,第乙個值代表上,第二個值代表左右,第三個值代表下;如果是四個值,按順序代表上、右、下、左,none表示沒有邊框

dashed:虛線邊框

double:雙實線邊框

solid:實線

dotted:小虛線

也可以單獨設定一條到四條邊框:border-right-style:設定右邊框的樣式\

調整邊框的粗細

border-width:後面可以跟四個值,順序和border-style:一致

設定邊框的顏色

border-color:後面可以跟四個值,順序如上

也可以單獨設定一條到四條邊框的顏色:border-right-color:設定右邊框的顏色

border:1px solid yellow;設定邊框粗細樣式和顏色

border-collapse:collapse;設定**內相鄰邊框是否合併(預設不合併,collapse是合併)

模組的邊距

使用在塊級元素上才有效果

margin-left:左外邊距

margin-top:上外邊距

margin-right:右外邊距

margin-bottom:下外邊距

margin:後面可以跟四個值

padding:內容距離容器的邊距用了padding會使容器增大 上下左右各增加padding的值得大小

div(層)的應用

div的應用+css 用在布局上,比table布局更有優勢,**量減少並且方便維護

div是乙個塊級元素,多個div預設垂直擺放,如果想讓這些塊級元素水平擺放,使用float:left;

clear:left;清除左浮動

clear:both;清除左右浮動

clear:right;清除右浮動

要最外層box上方與瀏覽器無縫隙,在css中使用margin:0px;``padding:0px;

層的定位

相對定位:以當前這個層所在的位置為基準進行定位

position: relative;

top:50px;

left:50px;

right: ;

botton: ;

絕對定位:如果父容器有定位,那麼該層會以父容器為基準,如果父容器沒有定位,那麼該層以網頁為基準

position:absolute;

top:50px;

left:50px;

right: ;

botton: ;

z-index:數字越大,層的位置就越上層

overflow:hidden;層中溢位的內容隱藏scroll;層中會有滾動條

設定滑鼠指標

cursor: ;

選單設定

選單用無序列表

將無序列表的垂直排列改為水平排列使用浮動:float:left;

把行內元素轉化為塊級元素:display:block;

HTML基礎複習4

css的應用 模組的邊框 設定邊框樣式 border style 如果是乙個值那麼表示四個邊的樣式都一樣 如果是兩個值那麼第乙個值代表上下,第二個值代表左右 如果是三個值,第乙個值代表上,第二個值代表左右,第三個值代表下 如果是四個值,按順序代表上 右 下 左,none表示沒有邊框 dashed 虛...

HTML基礎複習(一)

html 超文字標記語言 hypertext markup language 不是一種程式語言,是標記語言 html元素 段落 html標籤 段落 html宣告 並不是標籤 html5 html4.0.1 strict html 4.01 transitional html 4.01 framese...

HTML基礎複習2

6.6.1建立 由標籤來定義 每行由來定義,每行被分割為若干單元格,由來定義 資料單元格可以包含文字 列表 段落 表單 水平線 一列 100 一行三列 100200300 三行三列 d0def294ed096a8940d8d4e67e557edf.png en resource database 2...