綜合知識

當前位置 /首頁/綜合知識 > /列表

怎麼寫css樣式

1. css樣式 怎麼寫

手寫了一個例子:

怎麼寫css樣式

<html>

<head>

<style type="text/css">

.fl {float:left;}

.top .fl {width:28%; text-align:left;background-color:red;}

</style>

</head>

<body>

<div class="top">

<span class="fl">fl</span>

</div>

<br />

<span class="fl">fl</span>

</body>

</html>

效果如圖,第一個span是包含在div裏的(div 的class為top),為了能看清楚,加了紅色的背景。可以看出,紅色部分正好是頁面寬度的28%(371px/1366px約等於28%)。而第二個,沒有包含在div裏的span,沒有紅色背景,顯然是不受.top .fl {width:28%; text-align:left;background-color:red;}影響。。。當然咯,你自己測試的時候可以加上.top{***********},體會體會。。。不懂的話,追問咯 ^_^

2. 怎樣寫CSS樣式代碼

CSS的定義由三個部分構成:選擇符(selector),屬性(properties)和屬性的取值(value)。

CSS語法:

selector {property: value}

選擇符 {屬性:值}

選擇符有多種:類型選擇符、通配選擇符、屬性選擇符等。

類型選擇符:一般是你要定義樣式的HTML標記,例如BODY、P、TABLE……,你可以通過此方法定義它的屬性和值,屬性和值要用冒號隔開。

例子:body {color: black},此例的效果是使頁面中的文字為黑色。

如果需要對一個選擇符指定多個屬性時,我們使用分號將所有的屬性和值分開。

例子:p {text-align: center; color: red} (段落居中排列;並且段落中的文字為紅色)

這裏只是最基本的寫法,建議你去找教程學習,比如w3cschool裏的CSS教程。

在此推薦經典教程《精通CSS》。

參考資料裏有一些稍微詳細的內容,建議你看一看。

3. Css的樣式怎寫

.zt1 {

font-family: Arial, Helvetica, sans-serif;

font-size: 30px;

text-indent: 20px;

}

body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

background-image: none;

background-color: #EBEBEB;

}

4. 這個樣式用css怎麼寫

css樣式:

.gavin_design{margin:0 auto; overflow:hidden; display:block;}

.gd .fl{float:left;}

.gd .fr{float:right;}

.gd .tri{height:0; width:0; overflow:hidden; font-size:0; line-height:0; border-width:15px;}

.gd .rtri{border-color:transparent transparent #7caaff #7caaff; border-style:dashed dashed solid solid;}

.gd .ltri{border-color:#7caaff #7caaff transparent transparent; border-style:solid solid dashed dashed;}

.gd ul ,.gd ul li{list-style:none; margin:0; padding:0; overflow:hidden;}

.gd ul li i{display:block; font-style:normal; white-space:nowrap;}

.gd ul li{float:left; margin-left:-20px;}

.gd ul li.step1{margin-left:0;}

.gd ul li .text{background:#7caaff; color:#555; padding:0 10px; width:200px; height:30px; line-height:30px;}

.gd ul li.focus .text{background:#2673ff; color:#fff; font-weight:bold;}

.gd ul li.focus .rtri{border-color:transparent transparent #2673ff #2673ff;}

.gd ul li.focus .ltri{border-color:#2673ff #2673ff transparent transparent;}

html代碼:

1.選擇退款貨品

2.填寫退款原因、餘額

3.退款處理

4.退款完成

僅供參考,希望能幫助到你。

5. 這個樣式用css怎麼寫

css樣式: <style>.gavin_design{margin:0 auto; overflow:hidden; display:block;}.gd .fl{float:left;}.gd .fr{float:right;}.gd .tri{height:0; width:0; overflow:hidden; font-size:0; line-height:0; border-width:15px;}.gd .rtri{border-color:transparent transparent #7caaff #7caaff; border-style:dashed dashed solid solid;}.gd .ltri{border-color:#7caaff #7caaff transparent transparent; border-style:solid solid dashed dashed;}.gd ul ,.gd ul li{list-style:none; margin:0; padding:0; overflow:hidden;}.gd ul li i{display:block; font-style:normal; white-space:nowrap;}.gd ul li{float:left; margin-left:-20px;}.gd ul li.step1{margin-left:0;}.gd ul li .text{background:#7caaff; color:#555; padding:0 10px; width:200px; height:30px; line-height:30px;}.gd ul li.focus .text{background:#2673ff; color:#fff; font-weight:bold;}.gd ul li.focus .rtri{border-color:transparent transparent #2673ff #2673ff;}.gd ul li.focus .ltri{border-color:#2673ff #2673ff transparent transparent;}</style>html代碼: 1.選擇退款貨品 2.填寫退款原因、餘額 3.退款處理 4.退款完成 僅供參考,希望能幫助到你。

6. CSS樣式表怎麼做

1、創建使用css樣式表有三種,分別是外部樣式表,內部樣式表和內聯樣式。下面通過一個小demo演示它們的用法,首先新建一個html文件,放入3個button按鈕,給前兩個按鈕分別設置class屬性為btn1和btn2:

2、接着準備一個css文件,命名為demo.css,在文件內寫入按鈕A的樣式,保存css文件:

3、回到剛才的html文件,在style標籤中用link標籤引入上一步創建的css文件,這就是外聯樣式的用法,總結就是創建好的css文件內寫好樣式,然後在html文件中用link標籤引入即可,這也是大部分網站使用的方法,因為其引入方便,管理起來也比較方便:

4、接着是內部樣式表的使用,這裏直接在head標籤裏創建style標籤,在裏面加入btn2的樣式。對於內部樣式表簡單的html文件,內部樣式是很方便的,但是結構複雜的html文件使用它就會讓文件顯得很混亂:

5、最後是內聯樣式的使用,直接在第三個標籤內使用style屬性加入樣式就可以了:

6、最後保存html文件,打開瀏覽器可以看到三個按鈕的樣式都出現了。以上就是css樣式表的製作方法:

7. 這樣的DIV

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

<html xmlns="

<head>

<meta ; charset=utf-8" />

<title>;無標題文檔</title>

<style type="text/css">

<!--

strong { text-align:center; background-color:#0C0}

-->

</style>

</head>

<body>

<div style=" width:250px;">

<strong>;內容標題</strong>

這就是內容這就是內容這就是內容這就是內容這就是內容這就是內容<img name="guanggao" src="" width="100" height="100" alt="" style=" background-color:#00C;" />;就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容就是內容

</div>

</body>

</html>

TAG標籤:css #