一、CSS與HTML的四種結合方式：

/*方法一：使用標簽中的style屬性*/

/*方法二：使用style標簽*/

css代碼;

div {

background-color:blue;

color: red;

}

/*方法三：使用@import語句*/

在style標簽里面 使用語句(兼容性差)

@import url(css文件的路徑);

@import url(div.css);

/*使用頭標簽 link，引入外部css文件*/

優先級：一般情況下，由上到下，由外到內。優先級由低到高。

二、CSS的三種基本選擇器

標簽選擇器：

使用標簽名作為選擇器的名稱

div {

background-color:gray;

color:white;

}

class選擇器：

每個html標簽都有一個屬性 class

aaaaaaa

.hhh {

background-color: orange;

}

id選擇器：

每個html標簽上面有一個屬性 id

bbbbb

#hhh {

background-color: #333300;

}

優先級：style > id選擇器 > class選擇器 > 標簽選擇器

三、CSS的擴展選擇器

關聯選擇器

wwwwwwww

設置div標簽里面p標簽的樣式，嵌套標簽里面的樣式

div p {

background-color: green;

}

組合選擇器

1111

22222

把div和p標簽設置成相同的樣式，把不同的標簽設置成相同的樣式

div,p {

background-color: orange;

}

偽元素(偽類)選擇器(兼容性差)

css里面提供了一些定義好的樣式，可以拿過來使用

比如超鏈接

超鏈接的狀態

原始狀態 鼠標放上去狀態 點擊 點擊之后

:link :hover :active :visited

測試偽類元素選擇器

a:link{

background-color:#33cc00;

}

a:hover{

background-color:#ff00ff;

}

a:active{

background-color:#0066ff;

}

a:visited{

background-color:#999900;

}

四、CSS中的盒子模型

在進行布局前需要把數據封裝到一塊一塊的區域內(div)

有三個屬性：

(1)邊框

border: 2px solid blue;

border：統一設置

上 border-top

下 border-bottom

左 border-left

右 border-right

(2)內邊距

padding:20px;

使用padding統一設置

也可以分別設置上下左右四個內邊距

(3)外邊距

margin: 20px;

可以使用margin統一設置

也可以分別設置上下左右四個外邊距

五、CSS的布局

css的布局的漂浮

float：

屬性值

left :　 文本流向對象的右邊

right :　 文本流向對象的左邊

css的布局的定位

position：

屬性值

absolute ：

*** 將對象從文檔流中拖出

*** 可以是top、bottom等屬性進行定位

relative ：

*** 不會把對象從文檔流中拖出

*** 可以使用top、bottom等屬性進行定位

更多CSS樣式可以參考該博文：css樣式大全(整理版)

總結

以上是生活随笔為你收集整理的java的css的块_JavaWeb--了解CSS的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。