CSS基礎知識之(背景 文字格式 字型)

2021-10-20 20:49:36 字數 2942 閱讀 8368

顧名思義,背景屬性是用來定義html元素的背景。

包括顏色(background-color)、影象(background-image)等

例如,頁面的背景顏色使用在person的選擇器中:

person
css中,顏色值通常以以下方式定義:

background-image屬性描述了元素的背景影象。預設情況下,背景影象進行平鋪重複顯示(x軸或y軸),以覆蓋整個元素實體。

如:

person
當然,如果要求只在水平方向重鋪,可以用:repeat-x;

只在垂直方向重鋪,可以用:repeat-y;

若不想讓影象平鋪,可以使用no-repeat;

另外,如果要改變影象在背景中的位置,可以使用background-position。如:background-position:right top

background-attachment:用於設定背景影象是否固定或者隨著頁面的其餘部分滾動。

屬性值有:值描述

scroll

背景隨著頁面的滾動而滾動,這是預設的

fixed

背景不會隨著頁面的滾動而滾動

local

背景會隨著元素內容的滾動而滾動

initial

設定該屬性的預設值

inherit

指定background-attachment的設定應該從父元素繼承

也可以將上述所有屬性合併到同乙個屬性中,並可以將背景顏色的簡寫屬性為:「background」:

person
順序為:顏色、影象、影象重複方向、影象是否滾動及位置。

顏色屬性color用來設定文字的顏色,和背景顏色類似:

文字排列屬性text-align是用來設定文字的水平對齊方式;文字可居中或對齊到左或右,兩端對齊。

屬性值有center、left、right、justify(每一行被展開為寬度相等,左、右外邊距是對齊的)。

利用text-decoration屬性來設定或刪除文字的裝飾。屬性值有none、overline(在文字上方)、line-through(從文字中穿過)

、underline(從文字下方);

該屬性text-indent是用來指定文字的第一行的縮排。

屬性描述

屬性值color

文字顏色

見上direction

文字方向

ltr(從左到右)

rtl(從右到左)

inherit(從父元素繼承direction屬性的值)

letter-spacing

字元間距

normal(預設字元間沒有額外的空間)

length(如3px、-3px)

inherit

line-height

設定行高

normal(預設)

number(設定數字,此數字會與當前的字型尺寸相乘來設定行間距)

length(設定固定的行間距)

%(基於當前字型尺寸的百分比行間距)

inherti

text-align

對齊元素中的文字

見上text-decoration

向文字新增修飾

見上text-indent

縮排元素中文字的首行

見上text-shadow

文字陰影

h-shadow(必須項,水平陰影的位置。允許負值)

v-shadow(必須項,垂直陰影的位置。允許負值)

blur(可選項,模糊的距離)

color(可選項,陰影的顏色)

text-transform

控制元素中的字母大小寫

none(預設,定義帶有小寫字母和大寫字母的標準的文字)capitalize(文字中的每個單詞都以大寫字母開頭)

uppercase(定義僅有大寫字母)

lowercase(定義僅有小寫字母)

inherit

unicode-bidi

設定或返回文字是否被重寫

該屬性與direction屬性一起使用,來設定或返回文字是否被重寫,以便在同一文件中支援多種語言。

vertical-align

元素的垂直對齊

見上white-space

元素中空白的處理方式

normal(預設,空白會被瀏覽器忽略)

pre(空白會被瀏覽器保留,其行為方式類似html中的標籤)

nowrap(文字不會換行,文字會在同一行上繼續,直到遇到

標籤為止)

pre-wrap(保留空白符序列,但正常的進行換行)

pre-line(合併空白符序列,但保留換行符)

inherit

word-spacing

設定字間距,增加或減少字與字之間的空白

normal(預設為標準空間)

length(定義單詞間的固定空間)

該屬性定義字型、加粗、大小、文字樣式

有兩種型別的字型系列名稱:

利用font-family屬性來設定文字的字型系列。並且應該設定幾個字型名稱作為一種「後備」機制,如果瀏覽器不支援第一種字型,將自動嘗試下一種字型。

注意:如果字型系列的名稱超過乙個字,則必須用引號,如font family:「宋體」。多個字型之間用乙個逗號分隔開。

font-style主要用於指定斜體文字的字型樣式屬性。屬性值為:normal(正常)、italic(斜體)、oblique(傾斜的文字-文字向一邊傾斜)

font-size用於設定文字大小。

注意:不能通過調整字型大小使段落看上去像標題,或使標題看上去像段落。應該使用表示段落,-表示標題;如果不指定乙個字型的大小,預設大小和普通文字段落一樣,是16px(16px=1em)。

font-weight用於指定字型的粗細。

屬性值有light(更細)、normal(標準字元)、bold(粗體)、bolder(更粗的)。

HTML基礎知識 三 文字格式標籤

從h1到h6字型大小依次減小,字型預設加粗,可設定水平對齊方式 文字標籤font 文字 設定字型大小大小文字 預設3號字,從小到大有1到7號7個字型大小可選 設定字型顏色文字 預設黑色 設定字型屬性文字 預設瀏覽器預設字型,本地無某字型時,設定該字型無效,還是按預設字型顯示 直線標籤hr 設定水平對...

CSS基礎知識 backgroung(背景)

背景圖 background 縮寫形式 background color 背景顏色 語法 background color 顏色 background image 背景 語法 background image url background repeat 背景圖重複位置 其屬性值可以為 repeat ...

CSS基礎之 CSS基礎知識 1

結構至上,結構與表現分離。這是網頁標準化最優原則,也是web設計的最高境界。css全稱為 cascading style sheets 中文翻譯為 層疊樣式表 簡稱 css樣式表 又被我們稱為 css樣式 css樣式有時被作為一種能製作出各種樣式網頁的技術統稱。2000年,w3c公升級css為css...