當(dāng)前位置：首頁 > 前端技术 > HTML >内容正文

HTML

HTML学习笔记（三）样式CSS

發(fā)布時間：2025/6/17 HTML 32 豆豆

生活随笔收集整理的這篇文章主要介紹了 HTML学习笔记（三）样式CSS 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

1.樣式

外部樣式表（通過css文件定義樣式，整體樣式）

當(dāng)樣式需要被應(yīng)用到很多頁面的時候，使用外部樣式表，在?head 部分<link>。

內(nèi)部樣式表（單個文件的樣式）

當(dāng)單個文件需要特別樣式時，就可以使用內(nèi)部樣式表。你可以在 head 部分通過 <style> 標(biāo)簽定義內(nèi)部樣式表。

<head><style type="text/css"> body {background-color: red} p {margin-left: 20px} </style> </head>
這樣<body>和<p>就是上面的屬性了

內(nèi)聯(lián)樣式（單個控件的樣式）

當(dāng)特殊的樣式需要應(yīng)用到個別元素時，就可以使用內(nèi)聯(lián)樣式。使用內(nèi)聯(lián)樣式的方法是在相關(guān)的標(biāo)簽中使用樣式屬性。樣式屬性可以包含任何 CSS 屬性

<p style="color: red; margin-left: 20px"> This is a paragraph </p> 2.樣式選擇器（內(nèi)部樣式表）
標(biāo)簽選擇器（選擇器是標(biāo)簽）

用逗號將需要分組的選擇器分開h1，h2；值也可以有多個，用逗號隔開；
class選擇器

　類選擇器以一個點(diǎn)號顯示：

.center {text-align: center}
用class=“”來使用

id 選擇器

id 選擇器可以為標(biāo)有特定 id 的 HTML 元素指定特定的樣式。

id 選擇器以 "#" 來定義，用id=“”來使用

屬性選擇器

下面的例子為帶有 title 屬性的所有元素設(shè)置樣式：

選擇器定義：元素名 [屬性 = 屬性值] 只要元素使用了該屬性，就可設(shè)置此樣式。其中元素名、=屬性值可不寫

響應(yīng)式 Web 設(shè)計

RWD 指的是響應(yīng)式 Web 設(shè)計（Responsive Web Design）
RWD 能夠以可變尺寸傳遞網(wǎng)頁
RWD 對于平板和移動設(shè)備是必需的

創(chuàng)建您自己的響應(yīng)式設(shè)計

方法一：自己來創(chuàng)建它

方法二：使用現(xiàn)成的 CSS 框架——Bootstrap

<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> </head> <meta> 元素可提供有關(guān)頁面的元信息（meta-information），比如針對搜索引擎和更新頻度的描述和關(guān)鍵詞。

轉(zhuǎn)載于:https://www.cnblogs.com/dengquan/p/8728424.html

總結(jié)

以上是生活随笔為你收集整理的HTML学习笔记（三）样式CSS的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。