1,css有幾種引入方式

使用html標籤的style屬性

將style屬性直接加在單個的html元素標籤上，控制html標籤的表現樣式。這種引入css的方式是分散靈活方便，但缺乏整體性和規劃性，不利於後期的修改和維護，當需要修改**的樣式時，乙個相同的修改可能涉及多個地方，維護成本高。使用style屬性的樣式效果最強，會覆蓋掉其它幾種引入方式的相同樣式效果。

1
<
div 
style
="color:red"
>
div>

將樣式**寫在頁面標籤之中結構可以位於頁面標籤中的任何位置，也可以多次出現。通常是將整個結構寫在頁面的部分中。這種引入css方式的特點是每個頁面的css**可能具有統一性和規劃性，乙個頁面內部便於復用和維護，但多個頁面之間的css**復用仍然不夠。

1
<
style
>
2bdoy
3style
>

使用 link標籤，引入外部css檔案將css**寫在乙個單獨的檔案中，用link標籤直接引入該檔案到頁面中。乙個頁面可以多次使用link標籤引入多個外部css檔案，注意這些css**的相互影響，通常是後引入的css檔案會覆蓋前面引入的css檔案的相同效果。這種引入css的方式是目前最為流行的，可以在站個**範圍內進行css**的規劃，方便復用和維護，但這樣將**高度集中，**量可能過大，維護不當的話又容易出現混亂。

1
<
link 
rel="stylesheet"
type
="text/css"
href
="style.css"
>

使用@import引入css檔案使用@import引入css檔案有兩種方式，一種可以放在頁面中的中,用法如下：

@import url(index2.css);

另外也可以放在css檔案中使用，用法如下：

@import "sub.css";

使用用@import引入css可以很方便的引入外部檔案的css**，方便維護和規劃。但是每多引入乙個css檔案，就會對伺服器增加一次連線請求，當訪問量較大時，需在維護性和效能上進行權衡。

2,div除了可以宣告id來控制，還可以宣告什麼控制？

div除了用id賦予它乙個名稱外，

還可以用class來賦予它乙個名稱。

還可以不用賦予它乙個名字，直接用style來直接設定它的樣式。

唯一區別就是id是唯一的，只能用一次。反而class是可以反覆使用的，可以多個div同時時候class來定義樣式。

一般js中常用id，因為js是獲取div名字來進行判斷的，也是唯一判斷，如果用class會出錯，如果我們寫普通html，用class會好些。

3,如何讓2個div，併排顯示。

1
doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" ""
>
2<
html 
xmlns
="">34
<
head
>
5<
title
>div併排顯示
title
>
6head
>
7<
body
>89
<
div 
style
="width:300px;height:300px;background:blue;float:left"
>div1與div2併排 重點是float：left
div>
10<
div 
style
="width:300px;height:300px;background:red;float:left"
>div2重點與div1併排 重點是float：left<
div/>
11body
>
12html
>

效果圖是：

除了上面的 style="float:left"

還有 style="display:inline" 也是每個div中都要加

建立了浮動，阻斷與不阻斷的效果差別

不阻斷無 clear：both **中已經登出

1
doctype html
>
2<
html 
lang
="en"
>
3<
head
>
4<
meta 
charset
="utf-8"
>
5<
title
>浮動布局
title
>67
<
style
>
8#lside
14#rside
20#comm
2728
style
>
29head
>
30<
body
>
31<
div>
32<
div 
id="lside"
>我是左
div>
33<
div 
id="rside"
>我是右
div>
34<
div 
id="comm"
>普通
div>
3536
div>
37body
>
38html
>

顯示效果：

如果把clear：both 解除登出顯示效果：

1,css有幾種引入方式

css有幾種引入方式

css的幾種引入方式！

引入css的幾種方式

1,css有幾種引入方式

css有幾種引入方式

css的幾種引入方式！

引入css的幾種方式

相關推薦