藍鷗web開發:初識div + css引入方式
零基礎學習
html5
—html+css基礎【藍鷗出品】
web的第一節課就是學習什麼是
div。
div是我們最常用的標籤,沒有之一。在
html
的標籤中,每乙個標籤都是有語音的,
div的語義就是無意義。
茶哥兒沒有那你們開涮,就是這個樣子的,div在我們的開發中經常用來劃分區域,進行分快處理分塊開發。看了下圖你就能明白了。
ok,上**來看看如何操作
div(htm+css):
我是乙個div
之前已經說過html和
css的關係了(好**,一輩子),如果單純寫乙個
div我們是看不到任何東西的(並不是不存在),**中我們通過加入
css樣式(
div標籤中
style
屬性裡邊寫的就是
css樣式)從而改變了
div的大小和背景色,於是我們就看到他了,這裡我們使用的是
css的
行間樣式表。
這裡我們做個設想:body裡邊有
100個
div,要分別賦予寬
200px
,高200px
,背景色是紅色。
我勒個去,這是個多麼可怕的需求,我們難道要寫100個
div,再寫
100變
style
嗎?當然了,如果我們只能使用行間樣式表那麼肯定是要付出汗水與努力了,然而,我們還有另外兩種完美的解決方案:
內部樣式表&外部樣式表。
我是乙個div
這個就是內部樣式表了,我們在head標籤內新增了style標籤,在style標籤中書寫
css樣式,但是為了找準我們給哪個標籤新增讓樣式,所以我們使用了
選擇器:div{},這個叫做
標籤名選擇器
,會為相同的標籤新增這個樣式。ok再來看看外部樣式表怎麼寫:
我是乙個div
這段**是html文件的,我們在head標籤中新增了link標籤用來匯入外部檔案,在這裡我們匯入了外部的「index.css」檔案,看到這裡就明白了吧,所謂的外部樣式表就是將樣式寫入到了外部的
css檔案中,然後通過
link
匯入html
文件。來看看
index.css:
div {
width: 200px;
height: 200px;
background-color: red;
外部樣式表與內部樣式表寫法上是一致的,不同的是引入方式。
如果有乙個div,同時有三種樣式表為其賦予顏色這個時候
div應該用哪個呢?想知道嗎,接著看下邊的總結。
總結:
div用於分割螢幕,常用語分塊開發中;
行間樣式表:sytle標籤寫在標籤內部;
內部樣式表:style標籤寫在
head
標籤內;
外部樣式表:沒有style標籤,使用
link
標籤引入
css文件;
如果乙個標籤同時有三種樣式表為其賦予樣式,行間樣式表優先順序最高,內部樣式表與外部樣式表同等級,如何選用樣式取決於二者的引入順序。
藍鷗Unity開發基礎 List
藍鷗unity開發基礎 list 一 list list是一種強型別列表 list在大多數情況下比arraylist執行的更好並且是型別安全的 using system using system.collections 使用泛型集合,需要先引入命名空間 using system.collection...
藍鷗Unity開發基礎 構造方法
藍鷗unity開發基礎 構造和析構 一 構造和析構 構造方法 構造方法時乙個特殊的方法,負責初始化物件 構造方法名必須和類名一致 構造方法沒有返回值,但可以有引數,能夠過載 構造方法可以不寫,系統會自動為類新增乙個無引數的預設構造 如果將構造方法設定為private,就不能給你再使用此構造建立例項 ...
藍鷗Unity開發基礎 泛型
藍鷗unity開發基礎 泛型 本節課我們來學習c 中的泛型,泛型是乙個特殊的型別,它可以最大限度的重用我們的 使用泛型能夠最大限度的重用 保護型別安全,提高效能 泛型成員因為型別的不確定性,不能使用算術運算子,比較運算子 型別引數可以有多個,可以是編譯器能夠識別的任何型別 型別引數的名字不能夠隨便起...