Day2_CSS_CSS语法及HTML结合
CSS語法及HTML結合
二、CSS語法
?p{color：red;}
?
?選擇器{屬性名：屬性值 ;}
? ? ?選擇器后一定是大括號.屬性名后必須用冒號隔開.屬性值后用分號
? ? ?屬性名和冒號之間最好不要有空格。
? ? ?CSS注釋/* ? ? */
使用選擇器p{ }和<p>標簽的區別：
?p{
font-weight:bold;
font-style:italic;
}
</style>
?</head>
?<body>
<p>你好</p>
<p>你好</p>
<p>你好</p>
<p style = "color:red">你好</p>
三、CSS和HTML的結合方式
?CSS代碼理論上位置是任意的，但通常寫在style標簽里
?CSS和HTML的結合方式有3種：
? a. 行級樣式表:采用style屬性,范圍只針對此標簽適用
? ? <div style = "border:1px solid red ;">大家好</div>
? b. 內嵌樣式表:采用<style>標簽完成。范圍針對此頁面
<style type="text/css">
? c. 外部樣式表: 采用建立樣式表文件。針對多個頁面.
? ?引入樣式表文件的方式:
? ? 1):采用<link>標簽
? ? ?eg:<link rel = "stylesheet" type = "text/css" href = "a.css"></link>
????????<link rel = "stylesheet" type = "text/css" href = "a.css"></link>
? ? 2):采用import，必須寫在<style>標簽中，并且必須是第一句
? ? ?eg: @import url(a.css) ;
? ? ? ?
? ? 兩種引入方式的區別：
? ? ? 外部樣式表中不能寫<link>標簽,但是可以寫import語句
<!doctype html>
<html lang="en">
?<head>
? <meta charset="UTF-8">
? <meta name="Generator" content="EditPlus">
? <meta name="Author" content="">
? <meta name="Keywords" content="">
? <meta name="Description" content="">
? <link rel = "stylesheet" type = "text/css" href = "a.css"></link>
? <title>Document</title>
<style type="text/css">
?/*
?CSS和HTML的結合方式:
? 1. 行級樣式表: 采用style屬性完成
? 2. 內部樣式表: 采用style標簽完成
? 3. 外部樣式表: 采用外部css文件完成
?*/
p{
font-weight:bold;
font-style:italic;
}
</style>
?</head>
?<body>
<p>你好</p>
<p>你好</p>
<p>你好</p>
<p style = "color:red">你好</p>
?</body>
</html>
轉載于:https://blog.51cto.com/rickyigoogle/1683443
總結
以上是生活随笔為你收集整理的Day2_CSS_CSS语法及HTML结合的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： F# 4.0于全平台发布
- 下一篇： 【OPENGL】第三篇 着色器基础（一）