html标签和css参数
一、HTML標(biāo)簽
1、實(shí)體標(biāo)簽:
空格、
> 大于號(hào)
< 小于號(hào)
© 版本號(hào)
2、Meta標(biāo)簽:
charset 指定網(wǎng)頁(yè)的字符集
name 指定的數(shù)據(jù)的名稱
content 指定的數(shù)據(jù)的內(nèi)容
description 用于指定網(wǎng)站的描述
title標(biāo)簽的內(nèi)容會(huì)作為搜索結(jié)果的超鏈接上的文字顯示?
keywords 表示網(wǎng)站的關(guān)鍵字,可以同時(shí)指定多個(gè)關(guān)鍵字,關(guān)鍵字間使用,隔開。
3、語(yǔ)義標(biāo)簽:
1、標(biāo)題標(biāo)簽
h1 ~ h6 一共有六級(jí)標(biāo)題
從h1~h6重要性遞減,h1最重要,h6最不重要
標(biāo)題標(biāo)簽都是塊元素
在頁(yè)面中獨(dú)占一行的元素稱為塊元素(block element)
hgroup標(biāo)簽用來為標(biāo)題分組,可以將一組相關(guān)的標(biāo)題同時(shí)放入到hgroup。
em標(biāo)簽用于表示語(yǔ)音語(yǔ)調(diào)的一個(gè)加重。
strong表示強(qiáng)調(diào),重要內(nèi)容!
blockquote 表示一個(gè)長(zhǎng)引用,? q表示一個(gè)短引用。 ?
2、布局標(biāo)簽:
(1)header 表示網(wǎng)頁(yè)的頭部。
(2)main 表示網(wǎng)頁(yè)的主體部分(一個(gè)頁(yè)面中只會(huì)有一個(gè)main)。
(3)footer 表示網(wǎng)頁(yè)的底部。
(4)nav 表示網(wǎng)頁(yè)中的導(dǎo)航。
(5)aside 和主體相關(guān)的其他內(nèi)容(側(cè)邊欄)。
(6)article 表示一個(gè)獨(dú)立的文章。
(7) section 表示一個(gè)獨(dú)立的區(qū)塊,上邊的標(biāo)簽都不能表示時(shí)使用section。
(8)div 沒有語(yǔ)義,就用來表示一個(gè)區(qū)塊,目前來講div還是我們主要的布局元素 。
(9)span 行內(nèi)元素,沒有任何的語(yǔ)義,一般用于在網(wǎng)頁(yè)中選中文字。
4、塊元素和行內(nèi)元素的區(qū)別:
(1)塊元素(block element)
??????????? - 在網(wǎng)頁(yè)中一般通過塊元素來對(duì)頁(yè)面進(jìn)行布局
???????? 行內(nèi)元素(inline element)
??????????? - 行內(nèi)元素主要用來包裹文字
??????????? (2)- 一般情況下會(huì)在塊元素中放行內(nèi)元素,而不會(huì)在行內(nèi)元素中放塊元素
??????????? - 塊元素中基本上什么都能放
??????????? - p元素中不能放任何的塊元素
5、列表標(biāo)簽(html列表的三種創(chuàng)建方式):
??????? ??? 1、有序列表
?????? 2、無序列表
??????? ??? 3、定義列表
(1)有序列表,使用ol標(biāo)簽來創(chuàng)建無序列表
?????? ??????使用li表示列表項(xiàng)?
??????? (2)無序列表,使用ul標(biāo)簽來創(chuàng)建無序列表
??????? ?????使用li表示列表項(xiàng)
(3)定義列表,使用dl標(biāo)簽來創(chuàng)建一個(gè)定義列表
?????? ??????使用dt來表示定義的內(nèi)容
??????? ??????? ?使用dd來對(duì)內(nèi)容進(jìn)行解釋說明
?? 使用:列表之間可以互相嵌套。
6、超鏈接標(biāo)簽
?? 使用 a 標(biāo)簽來定義超鏈接
????? 屬性:
1、 href 指定跳轉(zhuǎn)的目標(biāo)路徑
???????????? - 值可以是一個(gè)外部網(wǎng)站的地址。
???????????? - 也可以寫一個(gè)內(nèi)部頁(yè)面的地址。
??????????? 2、target屬性,用來指定超鏈接打開的位置
?????????????? 可選值:
???????????????? _self 默認(rèn)值 在當(dāng)前頁(yè)面中打開超鏈接。
??????????????? ?_blank 在一個(gè)新的要么中打開超鏈接。
??????????? 3、可以使用 javascript:; 來作為href的屬性,此時(shí)點(diǎn)擊這個(gè)超鏈接什么也不會(huì)發(fā)生。
??????????? 4、可以直接將超鏈接的href屬性設(shè)置為#,這樣點(diǎn)擊超鏈接以后,頁(yè)面不會(huì)發(fā)生跳轉(zhuǎn)。
可以跳轉(zhuǎn)到頁(yè)面的指定位置,只需將href屬性設(shè)置 #目標(biāo)元素的id屬性值。id屬性(唯一不重復(fù)的):
?????? - 每一個(gè)標(biāo)簽都可以添加一個(gè)id屬性
??????? - id屬性就是元素的唯一標(biāo)識(shí),同一個(gè)頁(yè)面中不能出現(xiàn)重復(fù)的id屬性 。
7、圖片標(biāo)簽:
使用img標(biāo)簽來引入外部圖片,img標(biāo)簽是一個(gè)自結(jié)束標(biāo)簽。
屬性:
(1)src 屬性指定的是外部圖片的路徑(路徑規(guī)則和超鏈接是一樣的)
(2)alt 圖片的描述,這個(gè)描述默認(rèn)情況下不會(huì)顯示,有些瀏覽器會(huì)圖片無法加載時(shí)顯示搜索引擎會(huì)根據(jù)alt中的內(nèi)容來識(shí)別圖片,如果不寫alt屬性則圖片不會(huì)被搜索引擎所收錄
(3)width 圖片的寬度 (單位是像素)
(4)height 圖片的高度???
? - 寬度和高度中如果只修改了一個(gè),則另一個(gè)會(huì)等比例縮放
注意:
(1)一般情況在pc端,不建議修改圖片的大小,需要多大的圖片就裁多大.
(2)但是在移動(dòng)端,經(jīng)常需要對(duì)圖片進(jìn)行縮放(大圖縮小)。
(3)效果一樣,用小的,效果不一樣,用效果好的。
8、內(nèi)聯(lián)框架
內(nèi)聯(lián)框架,用于向當(dāng)前頁(yè)面中引入一個(gè)其他頁(yè)面。
屬性:
???? src 指定要引入的網(wǎng)頁(yè)的路徑
???? rameborder 指定內(nèi)聯(lián)框架的邊框
9、音視頻標(biāo)簽
(1)音頻標(biāo)簽
audio 標(biāo)簽用來向頁(yè)面中引入一個(gè)外部的音頻文件的。音視頻文件引入時(shí),默認(rèn)情況下不允許用戶自己控制播放停止。
屬性: controls 是否允許用戶控制播放
???? ??autoplay 音頻文件是否自動(dòng)播放, 如果設(shè)置了autoplay 則音樂在打開頁(yè)面時(shí)會(huì)自動(dòng)播放,但是目前來講大部分瀏覽器都不會(huì)自動(dòng)對(duì)音樂進(jìn)行播放 , loop 音樂是否循環(huán)播放 。
(2)視頻標(biāo)簽:
使用video標(biāo)簽來向網(wǎng)頁(yè)中引入一個(gè)視頻, 使用方式和audio基本上是一樣的。
二、CSS屬性
1、常用選擇器
(1)元素選擇器
????????? ?作用:根據(jù)標(biāo)簽名來選中指定的元素
????????? ?語(yǔ)法:標(biāo)簽名{}
?????????? 例子:p{}? h1{}? div{}
(2)id選擇器
????????? ?作用:根據(jù)元素的id屬性值選中一個(gè)元素
???????? ??語(yǔ)法:#id屬性值{}
?????????? 例子:#box{} #red{}?
(3)類選擇器
???????? ?作用:根據(jù)元素的class屬性值選中一組元素
??????? ??語(yǔ)法:.class屬性值
(4)通配選擇器
????????? 作用:選中頁(yè)面中的所有元素
???????? ?語(yǔ)法: *
(5)class標(biāo)簽和id標(biāo)簽的區(qū)別:
class 是一個(gè)標(biāo)簽的屬性,它和id類似,不同的是class可以重復(fù)使用,可以通過class屬性來為元素分組,可以同時(shí)為一個(gè)元素指定多個(gè)class屬性。
2、復(fù)合選擇器
(1)交集選擇器
????????? 作用:選中同時(shí)復(fù)合多個(gè)條件的元素
????????? 語(yǔ)法:選擇器1選擇器2選擇器3選擇器n{}
????????? 注意點(diǎn):
???????????? 交集選擇器中如果有元素選擇器,必須使用元素選擇器開頭。
(2)選擇器分組(并集選擇器)
??????????????? 作用:同時(shí)選擇多個(gè)選擇器對(duì)應(yīng)的元素
??????????????? 語(yǔ)法:選擇器1,選擇器2,選擇器3,選擇器n{}
3、關(guān)系選擇器
(1)子元素選擇器
??????? 作用:選中指定父元素的指定子元素
??????? 語(yǔ)法:父元素 > 子元素
(2)后代元素選擇器:
??????? 作用:選中指定元素內(nèi)的指定后代元素
??????? 語(yǔ)法:祖先 后代
(3)兄弟選擇器
下一個(gè)兄弟:
???????????? 語(yǔ)法:前一個(gè) + 下一個(gè)
??????? 選擇下邊所有的兄弟
???????????? 語(yǔ)法:兄 ~ 弟
(4)關(guān)系:
父元素:直接包含子元素的元素叫做父元素。
子元素:直接被父元素包含的元素是子元素。
祖先元素:直接或間接包含后代元素的元素叫做祖先元素,一個(gè)元素的父元素也是它的祖先元素。
后代元素:直接或間接被祖先元素包含的元素叫做后代元素,子元素也是后代元素。
兄弟元素:擁有相同父元素的元素是兄弟元素。
4、屬性選擇器
[屬性名] 選擇含有指定屬性的元素。
[屬性名=屬性值] 選擇含有指定屬性和屬性值的元素。
[屬性名^=屬性值] 選擇屬性值以指定值開頭的元素。
[屬性名$=屬性值] 選擇屬性值以指定值結(jié)尾的元素。
[屬性名*=屬性值] 選擇屬性值中含有某值的元素的元素。
5、偽類選擇器
?偽類(不存在的類,特殊的類)
????? - 偽類用來描述一個(gè)元素的特殊狀態(tài)
?????? 比如:第一個(gè)子元素、被點(diǎn)擊的元素、鼠標(biāo)移入的元素...
????? - 偽類一般情況下都是使用:開頭
屬性:
??????? :first-child 第一個(gè)子元素
????? ??:last-child 最后一個(gè)子元素
??????? :nth-child() 選中第n個(gè)子元素
?????????? ?特殊值:
????????????????? n 第n個(gè) n的范圍0到正無窮
???????????????? ?2n 或 even 表示選中偶數(shù)位的元素
???????????????? ?2n+1 或 odd 表示選中奇數(shù)位的元素
以上這些偽類都是根據(jù)所有的子元素進(jìn)行排序
:first-of-type
:last-of-type
:nth-of-type()
這幾個(gè)偽類的功能和上述的類似,不同點(diǎn)是他們是在同類型元素中進(jìn)行排序
:not() 否定偽類
??????????????? - 將符合條件的元素從選擇器中去除。
6、超鏈接偽類(a元素偽類)
:link 用來表示沒訪問過的鏈接(正常的鏈接)。
:visited 用來表示訪問過的鏈接,由于隱私的原因所以visited這個(gè)偽類只能修改鏈接的顏色。
:hover 用來表示鼠標(biāo)移入的狀態(tài)。
:active 用來表示鼠標(biāo)點(diǎn)擊。
7、偽元素選擇器
偽元素,表示頁(yè)面中一些特殊的并不真實(shí)的存在的元素(特殊的位置)
偽元素使用 :: 開頭
?????? ::first-letter 表示第一個(gè)字母
????? ?::first-line 表示第一行
?????? ::selection 表示選中的內(nèi)容
???? ??::before 元素的開始
?????? ::after 元素的最后
???????????? before 和 after 必須結(jié)合content屬性來使用
8、樣式的繼承
樣式的繼承,我們?yōu)橐粋€(gè)元素設(shè)置的樣式同時(shí)也會(huì)應(yīng)用到它的后代元素上,繼承是發(fā)生在祖先后后代之間的。
繼承的設(shè)計(jì)是為了方便我們的開發(fā),,利用繼承我們可以將一些通用的樣式統(tǒng)一設(shè)置到共同的祖先元素上,這樣只需設(shè)置一次即可讓所有的元素都具有該樣式
注意:并不是所有的樣式都會(huì)被繼承:
比如 背景相關(guān)的,布局相關(guān)等的這些樣式都不會(huì)被繼承。
9、選擇器的權(quán)重
??? 選擇器的權(quán)重
??????????????? 內(nèi)聯(lián)樣式??????? 1,0,0,0
??????????????? id選擇器??????? 0,1,0,0
??????????????? 類和偽類選擇器?? 0,0,1,0
??????????????? 元素選擇器?????? 0,0,0,1
??????????????? 通配選擇器?????? 0,0,0,0
??????????????? 繼承的樣式?????? 沒有優(yōu)先級(jí)
??????????? 比較優(yōu)先級(jí)時(shí),需要將所有的選擇器的優(yōu)先級(jí)進(jìn)行相加計(jì)算,最后優(yōu)先級(jí)越高,則越優(yōu)先顯示(分組選擇器是單獨(dú)計(jì)算的),
??????????????? 選擇器的累加不會(huì)超過其最大的數(shù)量級(jí),類選擇器在高也不會(huì)超過id選擇器
??????????????? 如果優(yōu)先級(jí)計(jì)算后相同,此時(shí)則優(yōu)先使用靠下的樣式
??????????? 可以在某一個(gè)樣式的后邊添加 !important ,則此時(shí)該樣式會(huì)獲取到最高的優(yōu)先級(jí),甚至超過內(nèi)聯(lián)樣式,
??????????????? 注意:在開發(fā)中這個(gè)玩意一定要慎用!
三、盒子模型
1、文檔流
? 文檔流(normal flow)
????????????? 我們所創(chuàng)建的元素默認(rèn)都是在文檔流中進(jìn)行排列
??????????? - 對(duì)于我們來元素主要有兩個(gè)狀態(tài)
??????????????? 在文檔流中
??????????????? 不在文檔流中(脫離文檔流)
??????????? - 元素在文檔流中有什么特點(diǎn):
??????????????? - 塊元素
??????????????????? - 塊元素會(huì)在頁(yè)面中獨(dú)占一行(自上向下垂直排列)
??????????????????? - 默認(rèn)寬度是父元素的全部(會(huì)把父元素?fù)螡M)
??????????????????? - 默認(rèn)高度是被內(nèi)容撐開(子元素)
??????????????? - 行內(nèi)元素
??????????????????? - 行內(nèi)元素不會(huì)獨(dú)占頁(yè)面的一行,只占自身的大小
??????????????????? - 行內(nèi)元素在頁(yè)面中左向右水平排列,如果一行之中不能容納下所有的行內(nèi)元素
??????????????????????? 則元素會(huì)換到第二行繼續(xù)自左向右排列(書寫習(xí)慣一致)
??????????????????? - 行內(nèi)元素的默認(rèn)寬度和高度都是被內(nèi)容撐開
2、盒子模型
(1)內(nèi)容區(qū)(content)
元素中的所有的子元素和文本內(nèi)容都在內(nèi)容區(qū)中排列 。
???????? 內(nèi)容區(qū)的大小由width 和 height兩個(gè)屬性來設(shè)置,width 設(shè)置內(nèi)容區(qū)的寬度,height 設(shè)置內(nèi)容區(qū)的高度。
(2)邊框
邊框(border),邊框?qū)儆诤凶舆吘?#xff0c;邊框里邊屬于盒子內(nèi)部,出了邊框都是盒子的外部,邊框的大小會(huì)影響到整個(gè)盒子的大小,要設(shè)置邊框,需要至少設(shè)置三個(gè)樣式:
邊框的寬度 border-width,邊框的顏色 border-color,邊框的樣式 border-style
(3)盒模型、盒子模型、框模型(box model)
CSS將頁(yè)面中的所有元素都設(shè)置為了一個(gè)矩形的盒子, 將元素設(shè)置為矩形的盒子后,對(duì)頁(yè)面的布局就變成將不同的盒子擺放到不同的位置,每一個(gè)盒子都由一下幾個(gè)部分組成:
內(nèi)容區(qū)(content), 內(nèi)邊距(padding),邊框(border),外邊距(margin)
3、盒子模型-邊框
(1)邊框
邊框的寬度 border-width,邊框的顏色 border-color,邊框的樣式 border-style
border-width可以用來指定四個(gè)方向的邊框的寬度
??????????????????????? 四個(gè)值:上 右 下 左
??????????????????????? 三個(gè)值:上 左右 下
??????????????????????? 兩個(gè)值:上下 左右
??????????????????????? 一個(gè)值:上下左右
除了border-width還有一組 border-xxx-width, xxx可以是 top right bottom left, 用來單獨(dú)指定某一個(gè)邊的寬度。
(2) 邊框的顏色
?border-color用來指定邊框的顏色,同樣可以分別指定四個(gè)邊的邊框, 規(guī)則和border-width一樣,? border-color也可以省略不寫,如果省略了則自動(dòng)使用color的顏色值。
(3)邊框樣式
border-style 指定邊框的樣式:solid 表示實(shí)線,dotted 點(diǎn)狀虛線,dashed 虛線,double 雙線, border-style的默認(rèn)值是none 表示沒有邊框。
border簡(jiǎn)寫屬性,通過該屬性可以同時(shí)設(shè)置邊框所有的相關(guān)樣式,并且沒有順序要求
除了border以外還有四個(gè) border-xxx, border-top,border-right,border-bottom,border-left。
4、盒子模型-內(nèi)邊距
內(nèi)邊距(padding):內(nèi)容區(qū)和邊框之間的距離是內(nèi)邊距
一共有四個(gè)方向的內(nèi)邊距: padding-top, padding-right,padding-bottom,padding-left
, - 內(nèi)邊距的設(shè)置會(huì)影響到盒子的大小, 背景顏色會(huì)延伸到內(nèi)邊距上
,一共盒子的可見框的大小,由內(nèi)容區(qū) 內(nèi)邊距 和 邊框共同決定,所以在計(jì)算盒子大小時(shí),需要將這三個(gè)區(qū)域加到一起計(jì)算。
padding 內(nèi)邊距的簡(jiǎn)寫屬性,可以同時(shí)指定四個(gè)方向的內(nèi)邊距,規(guī)則和border-width 一樣
5、盒子模型-外邊距
外邊距(margin): 外邊距不會(huì)影響盒子可見框的大小, 但是外邊距會(huì)影響盒子的位置
一共有四個(gè)方向的外邊距:
margin-top:上外邊距,設(shè)置一個(gè)正值,元素會(huì)向下移動(dòng)。
margin-right:默認(rèn)情況下設(shè)置margin-right不會(huì)產(chǎn)生任何效果。
margin-bottom:下外邊距,設(shè)置一個(gè)正值,其下邊的元素會(huì)向下移動(dòng)。
margin-left:左外邊距,設(shè)置一個(gè)正值,元素會(huì)向右移動(dòng)。
margin也可以設(shè)置負(fù)值,如果是負(fù)值則元素會(huì)向相反的方向移動(dòng)。
元素在頁(yè)面中是按照自左向右的順序排列的,所以默認(rèn)情況下如果我們?cè)O(shè)置的左和上外邊距則會(huì)移動(dòng)元素自身,而設(shè)置下和右外邊距會(huì)移動(dòng)其他元素。
margin的簡(jiǎn)寫屬性,margin 可以同時(shí)設(shè)置四個(gè)方向的外邊距 ,用法和padding一樣。
margin會(huì)影響到盒子實(shí)際占用空間。
6、水平布局
元素的水平方向的布局: 元素在其父元素中水平方向的位置由以下幾個(gè)屬性共同決定“
margin-left, border-left,padding-left,width,padding-right, border-right,margin-right
,一個(gè)元素在其父元素中,水平布局必須要滿足以下的等式
margin-left+border-left+padding-left+width+padding-right+border-right+margin-right = 其父元素內(nèi)容區(qū)的寬度 (必須滿足)。
7、垂直布局
子元素是在父元素的內(nèi)容區(qū)中排列的,如果子元素的大小超過了父元素,則子元素會(huì)從父元素中溢出,使用 overflow 屬性來設(shè)置父元素如何處理溢出的子元素
可選值:
????? visible,默認(rèn)值 子元素會(huì)從父元素中溢出,在父元素外部的位置顯示
????? hidden 溢出內(nèi)容將會(huì)被裁剪不會(huì)顯示
????? scroll 生成兩個(gè)滾動(dòng)條,通過滾動(dòng)條來查看完整的內(nèi)容
????? auto 根據(jù)需要生成滾動(dòng)條
8、外邊距的折疊
垂直外邊距的重疊(折疊):相鄰的垂直方向外邊距會(huì)發(fā)生重疊現(xiàn)象
兄弟元素:兄弟元素間的相鄰垂直外邊距會(huì)取兩者之間的較大值(兩者都是正值)
特殊情況:如果相鄰的外邊距一正一負(fù),則取兩者的和, 如果相鄰的外邊距都是負(fù)值,則取兩者中絕對(duì)值較大的
兄弟元素之間的外邊距的重疊,對(duì)于開發(fā)是有利的,所以我們不需要進(jìn)行處理
父子元素:父子元素間相鄰?fù)膺吘?#xff0c;子元素的會(huì)傳遞給父元素(上外邊距),父子外邊距的折疊會(huì)影響到頁(yè)面的布局,必須要進(jìn)行處理。
9、行內(nèi)元素的盒模型
(1)行內(nèi)元素不支持設(shè)置寬度和高度。
(2)行內(nèi)元素可以設(shè)置padding,但是垂直方向padding不會(huì)影響頁(yè)面的布局。
(3)行內(nèi)元素可以設(shè)置border,垂直方向的border不會(huì)影響頁(yè)面的布局。
(4)行內(nèi)元素可以設(shè)置margin,垂直方向的margin不會(huì)影響布局。
(5)display 用來設(shè)置元素顯示的類型
? 可選值: inline 將元素設(shè)置為行內(nèi)元素, block 將元素設(shè)置為塊元素, inline-block 將元素設(shè)置為行內(nèi)塊元素
(6)行內(nèi)塊,既可以設(shè)置寬度和高度又不會(huì)獨(dú)占一行, table 將元素設(shè)置為一個(gè)表格, none 元素不在頁(yè)面中顯示,
(7)visibility 用來設(shè)置元素的顯示狀態(tài),可選值:
visible 默認(rèn)值,元素在頁(yè)面中正常顯示
hidden 元素在頁(yè)面中隱藏 不顯示,但是依然占據(jù)頁(yè)面的位置。
10、默認(rèn)樣式
(1) 重置樣式表
專門用來對(duì)瀏覽器的樣式進(jìn)行重置的,reset.css 直接去除了瀏覽器的默認(rèn)樣式, normalize.css 對(duì)默認(rèn)樣式進(jìn)行了統(tǒng)一。
(2)默認(rèn)樣式
通常情況,瀏覽器都會(huì)為元素設(shè)置一些默認(rèn)樣式
默認(rèn)樣式的存在會(huì)影響到頁(yè)面的布局,? 通常情況下編寫網(wǎng)頁(yè)時(shí)必須要去除瀏覽器的默認(rèn)樣式(PC端的頁(yè)面)。
11、盒子尺寸
默認(rèn)情況下,盒子可見框的大小由內(nèi)容區(qū)、內(nèi)邊距和邊框共同決定
box-sizing 用來設(shè)置盒子尺寸的計(jì)算方式(設(shè)置width和height的作用),可選值:?
content-box 默認(rèn)值,寬度和高度用來設(shè)置內(nèi)容區(qū)的大小。
border-box 寬度和高度用來設(shè)置整個(gè)盒子可見框的大小。
width 和 height 指的是內(nèi)容區(qū) 和 內(nèi)邊距 和 邊框的總大小。
12、輪廓和圓角
(1)box-shadow
box-shadow 用來設(shè)置元素的陰影效果,陰影不會(huì)影響頁(yè)面布局 。
第一個(gè)值 水平偏移量 設(shè)置陰影的水平位置 正值向右移動(dòng) 負(fù)值向左移動(dòng)。
第二個(gè)值 垂直偏移量 設(shè)置陰影的水平位置 正值向下移動(dòng) 負(fù)值向上移動(dòng)。
第三個(gè)值 陰影的模糊半徑。
第四個(gè)值 陰影的顏色。
(2)outline
outline 用來設(shè)置元素的輪廓線,用法和border一模一樣
輪廓和邊框不同的點(diǎn),就是輪廓不會(huì)影響到可見框的大小 。
border-radius: 用來設(shè)置圓角 圓角設(shè)置的圓的半徑大小
border-top-left-radius:? 左上
border-top-right-radius : 右上
border-bottom-left-radius:? 左下
border-bottom-right-radius:? 右下
border-radius 可以分別指定四個(gè)角的圓角
???? 四個(gè)值 左上 右上 右下 左下
???? 三個(gè)值 左上 右上/左下 右下
???? 兩個(gè)值 左上/右下 右上/左下?
將元素設(shè)置為一個(gè)圓形??? border-radius: 50%;
總結(jié)
以上是生活随笔為你收集整理的html标签和css参数的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 强行在MFC窗体中渲染Cocos2d-x
- 下一篇: 王之泰/王志成《面向对象程序设计(jav