HTML&javaSkcript&CSS&jQuery&ajax-Css
CSS
1 、eg
<head>
<style>
body{
background-color:#d0e4fe;}
h1{
color:orange;
text-alin：center;}
p{
font-family:"Times New Roman";
font-size:2opx;}
</style></head>
<body>
<h1>CSS實例</h1>
<p>這是一個段落</p>
</body>
2、采用CSS 修飾
<head><style>p{ color:red; text-align:center}</style></head>
<body> <p>HELLO World</p></body
>
3 、ID選擇器和class選擇器
HTML中元素以ID屬性來設置選擇器，CSS中ID選擇器一# 來定義
<style>
#paral{
text-align:center;
color:red;
}
</style>
<body><p id="paral">Hello world</p></body>
4、 class 選擇器用於描述一組勻速的樣式，class選擇器有別於ID選擇器，class可以在多個元素中使用，class 選擇器在HTNL中以class屬性表示，類選擇器中以一個點號 . 表示
<style>
.center
{
text-align:center
}</style>
<body><h1 class="center">標題居中</h1></body>
5、CSS樣式分成三種分別是 外部樣式External Style sheet，內部樣式 internal style sheet，內聯樣式inline style當樣式用於多個頁面時，外部樣式最理想的選擇器， 在使外部樣式的時候使用一個文件夾改變整個站點的外觀，每個頁面使用<link>標簽鏈接到樣式表。 <link>標簽在文檔頭部
<head><link rel="stylesheet‘ type=‘text/css’’ href="mystyle.css">
6、背景設置的CSS
CSS背景屬性的定義 background-color background-image background-repeat background-attachment bancground-position
在body 選擇器中設置顏色 body{ background-color: #b0c4de;} background-image 屬性對背景圖像進行平鋪顯示，覆蓋整個元素實體<body>{ background-image:url(‘page.gif‘;)}
7、背景圖像水平或者垂直平鋪
水平方向平鋪 body{
background-image;url(‘image.gif‘);
background-repeat:repeat-x;} 如果不設置平鋪 no-repeat即可
設置具體位置 body{
background-repeat:no-repeat;
background-position:right top
}
8、簡寫方法 body{
background: #3ef322 url(‘image.png‘) no-repeat right top; margin-right:200px}
9、CSS文本格式
內聯樣式的字體樣式設置
<style>
body{
color:red;}
h1{color:#00ff00ff;}
p.ex{color:rgb(244;33;33);}</style>
<body><h1>biaoti </h1> <p>MKNf</p> <p class="ex">mklmm</p></body>
10、文本的修飾
text-decoration 屬性來設置或者刪除文本的裝飾 刪除鏈接的下劃線
<style> a{ text-decoration:none;}</style> <body><p >鏈接<a href="http://www.baidu.com/">鏈接</a>
11、文本轉換
<style> p.uppercase{ text-transform:uppercase;}
p.lowercase{text-transform: lowercase;}
p.capitalize{ text-transform:capitalize;}
</style>
<body> <p class="uppercase">This is some text</p>
<p class="lowercase">This is some text</p>
</body>
12、文本縮進
<style>p{text-indent:50px;}</style>
<body> my younger and more vulnerable years my father gave </body>
HTML&javaSkcript&CSS&jQuery&ajax-Css