1.CSS是層疊樣式表瓣窄,是一種用來表現(xiàn)HTML或XML等文件樣式的計(jì)算機(jī)語言。是控制div各種形狀的語法纳鼎。
2.Id選擇器俺夕;
類選擇器 ;
HTML元素選擇器贱鄙;
通配符選擇器劝贸;
3.background后可添加任意的你想要的背景,顏色逗宁,位置(x y)等
4.font-size:文字大小
font-weight:加粗 bold: normal:正常
font-style:文字樣式 italic 斜體 normal:正常
line-height:行高
font-family:"宋體"; 控制字體
復(fù)合樣式:順序不能改
font:font-weight font-style font-size/ine-height font-family
font中必有:font-size font-family
5.text-indent:首行縮進(jìn) 2em為兩個(gè)字節(jié)
6.格式<a href="地址">名</a>
href="頁面地址"--跳轉(zhuǎn)頁面
href="壓縮包地址"--下載
錨點(diǎn) href="id"直接跳轉(zhuǎn)到id所在位置
7.<a href="地址">網(wǎng)頁名</a>
默認(rèn)帶下劃線映九,字體蔚藍(lán)色,訪問后為紫色
8.盒子包括:內(nèi)容(content)瞎颗、填充(padding)件甥、邊框(border)、邊界(margin)哼拔, 由于其長(zhǎng)得像個(gè)盒子引有,叫盒模型。
9.padding:內(nèi)填充 邊框以里倦逐,內(nèi)容以外
margin:外邊距 邊框外面
10.margin疊加:相鄰兩個(gè)元素的上下margin是疊加在一起的譬正。
margin傳遞:子元素的margin會(huì)傳遞給父級(jí)。
11.h1-h6 :標(biāo)題(1-6逐漸變忻世选)曾我,p>段落標(biāo)簽 section:版塊,
header:頁面頭部穿铆。
footer:頁面底部您单。
12.DIV是塊元素 自己獨(dú)立一行,寬度撐滿整行
荞雏,SPAN是內(nèi)嵌元素 不支持寬高虐秦,對(duì)padding和margin支持的也有問題平酿,寬度由內(nèi)容撐開
塊元素:<div></div> <table></table>
內(nèi)嵌元素:<span> </span> <input>
編程
1<!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>無標(biāo)題文檔</title>
<style>
div1{width:0px;
height:0px;
border:100px solid red;
border-bottom:100px solid white;
margin:400px auto;
}</style>
</head>
<body>
<div id="div1"></div>
</body>
</html>
2
<!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>無標(biāo)題文檔</title>
<style>
box {
width:513px;
height:350px;
border:1px solid black;
padding:0 22px;
}
title {
width:108px;
height:43px;
margin:0px 404px 0px 2px;
font:bold 23px "宋體"; color:#3f5062;
}
body1 {
width:230px;
height:55px;
margin:1px 290px 0px 2px;
font:bold 20px/54px "宋體"; color red;
}
body2 {
width:470px;
height:80px;
margin:0px 51px 30px 2px;
font:14px "宋體";
color:#9b9b9b;
text-indent:2em;
border-bottom:1px dashed black;
}
body3 {
width:270px;
font:bold 17px"宋體";
text-indent:20px
}
body4 {
width:270px;
font:bold 17px "宋體";
text-indent:18px
}
body5 {
width:270px;
font:bold 17px"宋體";
text-indent:18px
}
body6 {
width:270px;
font:bold 17px/37px "宋體";
text-indent:18px
}</style>
</head>
<body><div id="box">
<div id="title">動(dòng)態(tài)新聞</div>
<div id="body1">掌握一門技術(shù)的重要性</div>
<div id="body2">掌握一門技術(shù)是未來生存的一塊敲門磚,掌握一門技術(shù)是未來生存的一塊敲門磚悦陋,掌握一門技術(shù)是未來生存的一塊敲門磚</div>
<div id="body3">走進(jìn)民企觀摩學(xué)習(xí)與民企面對(duì)面</div>
<div id="body4">走進(jìn)民企觀摩學(xué)習(xí)與民企面對(duì)面</div>
<div id="body5">走進(jìn)民企觀摩學(xué)習(xí)與民企面對(duì)面</div>
<div id="body6">走進(jìn)民企觀摩學(xué)習(xí)與民企面對(duì)面</div>
</div>
</body>
</html>