CSS第二講 CSS屬性

時間 2019-11-06

標籤 css 第二屬性欄目 CSS 简体版

原文原文鏈接

1.文本屬性css

文字font：html

font-size：字體大小ide

font-family：字體字體

font-weight：字體粗細ui

font-style：字體樣式（如：傾斜等）url

color：字體顏色spa

line-height：居中設計

段落：xml

text-decoration:下劃線htm

text-indent：設置文本縮進

text-align：設置對象內容對齊方式

2.邊框屬性

border-width：邊框寬度

border-style：邊框樣式

border-color：邊框顏色

nborder-collapse：表格邊框合併爲單邊框

3.控制背景

background-p_w_picpath：設置背景圖片

background-color：設置對象的背景顏色

background-position：設置對象的背景圖片位置

background-repeat：設置對象的背景鋪排填充

簡寫：

url（） repeat center center （圖片路徑，重複方式，水平位置，垂直位置）

4盒子模型

網頁設計中每一個元素都是長方形盒子

margin：邊界（倆相鄰元素直接的距離）

border：表框

padding：當前對象和邊界之間距離，內部距離

folat：浮動，當前隊形浮動後，周圍元素會環繞

clear：清除浮動

5.列表（list-style）

list-style-p_w_picpath：對象列表項標記的圖形

list-style-position：對象如何根據文本排列

list-style-type：隊形列表項實用的預設標記

6.定位（position）

position：static | relative | absolute | fixed

案例效果：

代碼以下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<style type="text/css">
*{ margin:0px; padding:0px;}
ul,ol,li{ list-style:none;}
body{ font-size:16px; font-family:"微軟雅黑", "幼圓", "黑體", "宋體";}
#banner{ margin:0 auto; ; height:56px; }
#top{ ; height:45px; url(p_w_picpaths /navbg_03.gif) no-repeat;}
#top li{ ; height:45px; float:left; line-height:45px; text-align:center;}
#top li a{ text-decoration:none; color:#FFF; display:block; margin:0 auto; ; height:56px;}
#top li a:hover{ url(p_w_picpaths /mouseover_03.gif) no-repeat; color:#333;}

</style>

</head>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。