css相對定位和絕對定位，css就近原則_CSS常用總結 - div-import-border - ItBoth

[HTML CSS + DIV實現整體布局1、技術目標：開發符合W3C標準的Web頁面理解盒子模型實現DIV+CSS整體布局2、什么是W3C標準？??? W3C：World Wide Web Consortium，萬維網聯盟

CSS索引

一.CSS樣式選擇器

1.通用選擇器——{font-family:"宋體";?declaration2;?...?declarationN?}

2.類型選擇器——p{font-family:"宋體";?}?或p1，p2{font-family:"宋體";?}逗號代表或者的意思。

css相對定位和絕對定位、3.Class——p.code{font-family:"宋體";?}

td.fancy?{

color:?#f60;

background:?#666;

}

在上面的例子中，類名為?fancy?的表格單元將是帶有灰色背景的橙色。

div和css的優勢有哪些、4.ID——#code{font-family:"宋體";?}

#sidebar?p?{????font-style:?italic;????text-align:?right;????margin-top:?0.5em;????}

二.樣式表

1.行內樣式表

2.內部樣式表

hr?{color:?sienna;}

css實現左側固定？p?{margin-left:?20px;}

body?{background-image:?url("images/back40.gif");}

3.外部樣式表

當樣式需要應用于很多頁面時，外部樣式表將是理想的選擇。在使用外部樣式表的情況下，你可以通過改變一個文件來改變整個站點的外觀。每個頁面使用??標簽鏈接到樣式表。?標簽在(文檔的)頭部：

4.樣式表優先級——就近原則

三.屬性

右側自適應布局？1.文字

.font1{font-family:verdana;?font-style:italic;?font-variant:?small-caps;?font-weight:?lighter;

font-size:18pt;?color:red}

.code{font-size:16pt;color:red}

2.文本

屬性

css屬性選擇器？描述

設置文本顏色[js可實現用戶對頁面中的選擇條件改變頁面中的樣式，頁面樣式可以通過style修飾，也可以通過css修飾，先來看一下js改變style樣式，代碼如下: Change.html

設置文本方向。

設置行高。

設置字符間距。

文本對齊。

css類選擇器使用實例。向文本添加修飾。

首行縮進。

控制元素中的字母。

設置字間距。

.text1{word-spacing:4;?letter-spacing:4;?text-decoration:blink;?font-size:18pt;?color:red}

3.背景屬性

css link，.p1{background-image:url(images/02.jpg);?background-repeat:no-repeat;}

4.超鏈接

A:link?未訪問時的狀態

A:visited?訪問過后的狀態

A:active?鼠標點中不放時的狀態

A:hover?鼠標劃過時的狀態

如何讓css只在當前組件中起作用，/*?我是注釋?*/

a:link{color:green;text-decoration:none}

a:active{color:blue;text-decoration:none}

a:visited{color:orange;text-decoration:none}

a:hover{color:red;text-decoration:underline}

5.邊距屬性

@import、.p1{background-image:url(images/02.jpg);?background-repeat:no-repeat;margin-left:5em}

6.邊框屬性

p{border:10px?double?purple}??

四.CSS布局

1.DIV標記(分塊標記)——

This?is?a?header

This?is?a?paragraph.

2.span標記(行標記)——***

some?text.some?other?text.

3.DIV&span區別

Div會造成換行，span不會。

4.display屬性

css偽類，display?屬性規定元素應該生成的框的類型。

p.inline??{??display:inline;??}

Inline在同一行中顯示，none文字不會被顯示，block換行輸出.

5.@import合并央視文件

可將多個css文件合并成一個css文件.[?前幾天心血來潮用jquery-easyui+spring、struts2、hibernate實現了一個系統的一小部分功能，下面給大家分享一下。 ? 首先看運行效果： 【圖一：登錄頁】 ...]