css之常用樣式及display樣式

2021-07-15 08:05:20 字數 2396 閱讀 1791

————————-常用樣式————————–

一:背景(背景可以為純色,也可以通過以下屬性的修飾變得絢麗多彩)

1.設定背景色:background-color

3.設定背景是否重複:background-repeat,其值有四個:

a.repeat:背景圖重複,即平鋪(預設值)

b.repeat-x:橫向平鋪

c.repeat-y:縱向平鋪

d.no-repeat:不平鋪

4.設定背景圖位置:background-position:a ba代表背景圖在div框架上水平方向的位置,b代表垂直方向的位置,一般以畫素為單位,其值具體包括center,left,right,top,bottom,後四個需要時加具體數值

5.設定背景復合:例如,background:#000 url(..) no-repeat center但需要注意,復合樣式和單獨樣式不能同時出現

更多關於背景的樣式

更多關於文字的樣式

三:字型(字型屬性定義文字的字型系列、大小、顏色,加粗、風格(如斜體)和變形(如小型大寫字母)等。前幾種在前面已經提到。下面是對後幾種的介紹)

1.字型加粗:font-weight,其值可以為:

a.nomal:預設值

b.bold:加粗

c.bolder更粗

d.light:變細

e.通過100-900的數值數值沒有單位微調粗細程度

2.字型風格:font-style,其值可以為:

a.nomal:預設值

b.italic:斜體

3.字型變形font-variant。其值可以為:

a.nomal:預設值

b.small-caps瀏覽器會顯示小型大寫字母的字型。

關於文字和字型的部落格

————————-display樣式————————–

1.屬性值:

a.block:將當前轉為塊狀元素;

b.inline:將當前轉為內聯元素;

c.inline-block:將當前轉為內聯-塊元素;

d.none:隱藏該元素

2.用途:

a.塊狀元素和內聯元素的相互轉化;

b.可以利用display:none實現下拉框選單的效果

dispaly:block/inline用法示例:

display:inline-block用法示例:

就可以實現從

的轉化。

補充:消除inline-block之間的空格

1.出現空格的原因:在書寫上下兩行標籤時,敲入了回車換行,瀏覽器將它解析為空格;

2.消除空格的方法:

a.不換行書寫**;或將換行處注釋掉;

b.設定margin-left值為負,讓每乙個塊向左移動

c.設定父標籤,在父屬性裡新增font-size:0px最後可以實現消除空格的功能:

CSS及常用樣式

選擇器如何使用css樣式 css樣式優先順序 常用css樣式屬性 第一種 該種樣式表只能定義在style標籤或css檔案中,每個style標籤或css檔案可定義多個css樣式表 選擇器第二種 該種樣式表只能定義在style標籤屬性 html文件中每個標籤都有乙個style標籤屬性。style dec...

css 常用樣式

css 說的通俗一點就是 給標籤加樣式的。什麼玩意是樣式呢。你們可以理解為人穿的衣服,化妝之類的修飾,讓自己的寫的標籤變的好看一點 那麼這個css 怎麼加到對應的標籤上面去呢 有3種方法 分別是 外部樣式 內頁樣式 行內樣式。那麼這個css 怎麼加到對應的標籤上面去呢 有3種方法 分別是 外部樣式 ...

css常用樣式

格式調整 標籤的位置調整 text align center 絕對元素生成 position absolute margin right 微調上下左右 浮動 float 上下左右 width 寬 height 高 樣式調整 字型粗細 font weight size 字型格式 text decora...