web前端初步

2021-10-16 08:55:32 字數 2816 閱讀 7419

web前端日記

css:

1.什麼是css?

層疊樣式表

html:建房子

css:裝修

css不能脫離html而單獨存在

style.css

2.基礎語法

1.屬性設定

屬性名和屬性值之間使用 :

多對屬性之間使用 ;

最後一對屬性可以不加 ;

width:100px;

height:100px

style屬性:

style="width:100px;"

style標籤:

html:

divp span

2.注釋

/*注釋內容*/

css中,注釋不能巢狀使用

3.速記寫法

簡寫形式:

padding:

padding-top:10px

padding-left:10px

padding-bottom:10px

padding-right:10px

->

padding:10px;

padding:10px 20px;

padding:10px 20px 30px;

padding:10px 20px 30px 40px;//上 右 下 左

margin

margin:10px auto

border:1px solid red;

3.選擇器

標籤選擇器:

divp

span

id選擇器:

id=『one』

#one

class選擇:

class=『one』

.one

普遍選擇器:

* 選擇所有

*後代選擇器:

>

空格兄弟選擇器:

+ ~組合選擇器:

div#one

div.one

div.one p

div.one~p>span

多選擇器:

div,p,div>p

屬性選擇器:

[class]

[class='one']

[class~='one']

[class^='one']

[class$='one']

[class*='one']

偽類選擇器:

:偽類名稱

:first-child

:last-child

:nth-child(num/odd/even)

:first-of-type

:last-of-type

:link{}

:hover

:active

:visited

l->v->h->a

偽元素選擇器

hello

style:

::first-letter

hello:

::first-letter

::first-line

::before

content:''/url()

::after

content:''/url()

::selection

4.選擇器優先順序

!important;//不計入優先順序的計算,優先順序最高

建議少用

特性值的計算:

特性值越高,優先順序越高;

特性值相同,誰更靠近html,誰的優先順序越高

寫在style屬性內部:

1000

id選擇器:

100類/偽類/屬性:

10標籤/偽元素:

1

5.繼承

1.有些預設繼承父元素

有些不繼承

2.屬性

1) inherit 繼承父元素的樣式

2) initial 不繼承。應用瀏覽器的預設樣式

6.尺寸+顏色-單位

尺寸:1》絕對單位

px2〉相對單位

百分比1em~1個m的寬度(16px)

顏色:1.關鍵字

redblue

2.rgb(r,g,b)

r:red

g:green

b:blue

0-255

3.rgba(r,g,b,a)

a:apcaity:透明度

0-1:

0:完全透明

1:完全不透明

4.16進製制顏色值

# #ff0000

#fff:白色

#ccc:灰色

....

7.文字樣式

color:

c:/winodws/fonts

c:/users/fonts

font-family:""

web-font:網路字型

2.宣告字型

安裝3.引用

.one

.myone

字型圖示:

1.font-awesome

2.在html中引入外部css檔案

3.在行內元素上,設定class='fa fa-***'

2.icon-font

2.在html中引入外部css檔案

3.在行內元素上,設定class='iconfont ***x'

這裡是引用

Web前端的初步了解

git初步了解 github和git 功能使用git的原因 github和git的關係 git是一款免費 開源的分布式版本控制系統,用於敏捷高效地處理任何或小或大的專案 git是乙個開源的分布式版本控制系統,用以有效 高速地處理從很小到非常大的專案版本管理 當團隊合作是,每個人都有各自的分工,git...

Web開發初步

清除浮動 浮動的元素不再占用原文件流的位置。對子元素設定浮動時,如果不對父元素定義高度,那麼子元素的浮動會對父元素造成影響,父元素會變成一條直線。使用浮動時會影響後面相鄰的固定元素因此需要清除浮動。clear方法,這種方法只能清楚左右兩側的浮動。清除浮動常用的3種方法 1 使用空標記法。2 使用ov...

前端01初步了解前端

目錄html html的文件結構 標籤的分類 head內的常用標籤 body內常用標籤 body 內的特殊號 標籤分類 標籤通常應該有兩個屬性 body內重要的標籤 目前的軟體開發架構有兩種 其本質就是請求和響應 當我在瀏覽器輸入乙個 時,首先會朝著指定的伺服器傳送乙個請求,然後伺服器接收請求,並進...