# CSS代碼書寫位置
# 如何開始編寫一個網(wǎng)站
# 練習(xí):努比亞官網(wǎng)
# 透明色 transparent
# 伸縮布局
# 元素透明度 opacity
1.行內(nèi)標(biāo)簽
可以將CSS代碼寫到開始標(biāo)簽中
2.內(nèi)嵌樣式
可以在一對head標(biāo)簽當(dāng)中寫上一對style標(biāo)簽,然后再style標(biāo)簽中編寫CSS代碼
div{
color:red;
}
3.外鏈樣式 - 企業(yè)開發(fā)中一般使用
可以單獨新建一個css文件,把CSS代碼寫到這個文件中,然后通過link標(biāo)簽把這個文件和.html文件關(guān)聯(lián)起來
4.導(dǎo)入樣式
可以單獨新建一個css文件,把CSS代碼寫到這個文件中,然后通過@import把這個文件和.html文件關(guān)聯(lián)起來
import
外鏈樣式和導(dǎo)入樣式區(qū)別:
外聯(lián)樣式時通過link標(biāo)簽關(guān)聯(lián)而導(dǎo)入樣式是通過@import關(guān)聯(lián)而@import是CSS2.1推出的,所以有兼容問題
2.外鏈樣式是顯示界面的時候,會先加載CSS樣式,再加載結(jié)構(gòu),所以用戶看到界面時一定已經(jīng)設(shè)置了樣式
導(dǎo)入樣式在顯示界面的時候,會先夾在CSS樣式,再加載結(jié)構(gòu),所以用戶看到界面時還沒加載樣式,影響用戶體驗
# 如何開始制作一個網(wǎng)頁
1.編寫網(wǎng)站要做的第一件事情
創(chuàng)建站點文件夾,并且創(chuàng)建一些子文件夾和子文件
注意點:創(chuàng)建站點文件夾可以寫中文
但是站點文件夾下面的子文件夾和子文件不能出現(xiàn)中文
2.重置所有默認(rèn)的樣式和設(shè)置一些全局樣式,并且將設(shè)置樣式的css文件和對應(yīng)的界面關(guān)聯(lián)起來
(2.1 清空邊距,清空樣式)
(2.2 設(shè)置全局樣式 字體 字體顏色 背景顏色)
練習(xí):努比亞
如果圖片寬度大于父元素的寬度,如何讓圖片居中顯示?
注意點:
1.如果圖片的寬度大于父元素的寬度,不能使用margin: 0 auto;或者text-align: center;使圖片居中
2.如果圖片寬度大于父元素寬度,可以使用定位流讓圖片居中
但是定位流的弊端也比較明顯:1.需要寫三行代碼 2.必須知道圖片的寬度
3.如果圖片的寬度大于父控件的寬度,也可以使用奇淫技巧:
父元素設(shè)置text-align: center;
給需要居中的元素添加margin: 0 -100%;
透明色? transparent
border: 2px solid transparent;
伸縮布局:
display:flex;
justify-content: space-between;
元素透明度
opacity: 0;
特點:子元素也會跟著透明
