前端開(kāi)大語(yǔ)言三種:1)HTML(hypertext markup language)結(jié)構(gòu)2)css(Cascading Style Sheets)樣式 ?3)js(Javascript)行為 ?腳本語(yǔ)言

屬性:屬性值 ?用來(lái)描述標(biāo)簽的一些特征的關(guān)鍵詞

?

關(guān)于css樣式的引入方式 一共有三種

1)行間樣式表(寫(xiě)在標(biāo)簽的開(kāi)始標(biāo)記上)

2)內(nèi)部樣式 ?寫(xiě)在<style></style>標(biāo)簽之間

3)外部樣式表 ?用<link>標(biāo)簽引入

關(guān)于盒模型的一些屬性

overflow屬性

屬性值

visible ?默認(rèn)值,內(nèi)容不會(huì)被修剪,會(huì)呈現(xiàn)在元素框之外

hidden ?內(nèi)容會(huì)被修剪,并且其余內(nèi)容是不可見(jiàn)的

scroll ?內(nèi)容會(huì)被修剪但是瀏覽器會(huì)顯示滾動(dòng)條以便查看其余的內(nèi)容

auto ?如果內(nèi)容被修剪,則瀏覽器會(huì)顯示滾動(dòng)條,以便查看其余的內(nèi)容.

inhert規(guī)定應(yīng)該從父元素繼承overflow屬性值.

?

margin屬性 ?外邊距

margin是可以設(shè)置負(fù)值的

外邊距:margin(也是一個(gè)復(fù)合屬性)可以跟一個(gè)值,兩個(gè)值,三個(gè)值,四個(gè)值

順序是 ? margin-top,margin-right,margin-bottom,margin-left

?

關(guān)于margin有兩個(gè)常見(jiàn)的問(wèn)題

1.上下邊距重疊問(wèn)題

兩個(gè)上下相鄰的元素,如果上個(gè)元素設(shè)置了margin-bottom,下面的元素設(shè)置了margin-top,并不會(huì)將兩個(gè)值加起來(lái),而是取其中較大的

的值進(jìn)行顯示

2.當(dāng)兩個(gè)元素為父子關(guān)系時(shí)(嵌套),給子元素添加(margin-top)值得時(shí)候,該值會(huì)傳遞父級(jí).

關(guān)于對(duì)這個(gè)問(wèn)題的解決方案有五種

1)給父級(jí)添加overflow:hidden

2)給父級(jí)增加border:1px solid transparent(這是一個(gè)透明色);

3)給父級(jí)增加display:inline-block;

4)給父級(jí)position:absolute;

5)給父級(jí)增加padding-top:1px;

border邊框的屬性

border-style屬性值:

none:定義無(wú)邊框

hidden 與"none相同",不過(guò)用于表示除外,對(duì)于表hidden解決了邊框沖突

dotted定義點(diǎn)狀邊框.在大多數(shù)瀏覽器中呈現(xiàn)為實(shí)線

dashed定義虛線.在大多數(shù)瀏覽器中呈現(xiàn)為實(shí)線

double定義為雙線.雙線的 寬度等于boder-width的值

groove定義3d凹槽邊框嗎,取決于boder-color

另外還有 ?ridge3d壟狀邊框。其效果取決于 border-color 的值。

inset 定義 3D inset 邊框。其效果取決于 border-color 的值。

outset 定義 3D outset 邊框。其效果取決于 border-color 的值。

inherit 規(guī)定應(yīng)該從父元素繼承邊框樣式。

?

關(guān)于文本的一些設(shè)置

?

font-size:字體大小 ?一般為偶數(shù),單位px, em, rem

?

網(wǎng)頁(yè)中顏色的設(shè)置

用英文單詞作為屬性值,也可以用rgb(),rgba()和十六進(jìn)制色彩值表示

?

屬性值

值 描述

xx-small

x-small

small

medium

large

x-large

xx-large

把字體的尺寸設(shè)置為不同的尺寸，從 xx-small 到 xx-large。

默認(rèn)值：medium。

smaller 把 font-size 設(shè)置為比父元素更小的尺寸。

larger 把 font-size 設(shè)置為比父元素更大的尺寸。

length 把 font-size 設(shè)置為一個(gè)固定的值。

% 把 font-size 設(shè)置為基于父元素的一個(gè)百分比值。

inherit 規(guī)定應(yīng)該從父元素繼承字體尺寸。

?

color設(shè)置文本的字體顏色

?

color_name 規(guī)定顏色值為顏色名稱(chēng)的顏色（比如 red）。

hex_number 規(guī)定顏色值為十六進(jìn)制值的顏色（比如 #ff0000）。

rgb_number 規(guī)定顏色值為 rgb 代碼的顏色（比如 rgb(255,0,0)）。

inherit 規(guī)定應(yīng)該從父元素繼承顏色。

?text-align文字對(duì)齊方式

left把文本排列在左邊.默認(rèn)值:由瀏覽器決定.

right 把文本排列到右邊

center 把文本排列在中間

justify實(shí)現(xiàn)兩端對(duì)齊的文本對(duì)齊文本效果

inherit規(guī)定應(yīng)該從父元素繼承 text-align屬性值

font-weight文字著重

?

?

normal 默認(rèn)值。定義標(biāo)準(zhǔn)的字符。

?

bold 定義粗體字符。

?

bolder 定義更粗的字符。

?

lighter 定義更細(xì)的字符。

?

100

?

200

?

300

?

400

?

500

?

600

?

700

?

800

?

900

?

定義由粗到細(xì)的字符。400 等同于 normal，而 700 等同于 bold。

?

inherit 規(guī)定應(yīng)該從父元素繼承字體的粗細(xì)

?

text-decoration文本修飾

?

none 默認(rèn).定義標(biāo)準(zhǔn)的文本.

underline 定義文本下的線

overline定義文本的上的一條線

lin-through 定義穿過(guò)文本下的一條線

blink 思念故意閃爍的文本

inherit規(guī)定應(yīng)該懂父元素繼承text-decoration屬性的值

?

word-spacing單詞間距(有空格為解析單位)

normal 默認(rèn)。定義單詞間的標(biāo)準(zhǔn)空間。

length 定義單詞間的固定空間。

inherit 規(guī)定應(yīng)該從父元素繼承 word-spacing 屬性的值。

?

letter-spacing ?字符間距

?

font-family字體(通常中文默認(rèn)是宋體)

line-height行高

text-indent首行縮進(jìn)(em縮進(jìn)字符)

font-style 文字樣式

normal 默認(rèn)值。瀏覽器顯示一個(gè)標(biāo)準(zhǔn)的字體樣式。

italic 瀏覽器會(huì)顯示一個(gè)斜體的字體樣式。

oblique 瀏覽器會(huì)顯示一個(gè)傾斜的字體樣式。

inherit 規(guī)定應(yīng)該從父元素繼承字體樣式。

?

?

?

?

?

轉(zhuǎn)載于:https://www.cnblogs.com/mdw521forever/p/6216743.html

總結(jié)

以上是生活随笔為你收集整理的关于一些html和css2的知识点的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。