2020-3-2 前端達(dá)人
HTML 樣式
通過使用 HTML4.0,所有格式化代碼均可移出 HTML 文檔,然后移入一個(gè)獨(dú)立的樣式表。
先來看一個(gè)例子,代碼如下:
<head>
<style type="text/css">
h1 {color: red}
p {color: blue}
</style>
</head>
<body>
<h1>header 1</h1>
<p>A paragraph.</p>
</body>
頁面上顯示為:
header 1
A paragraph.
當(dāng)瀏覽器讀到一個(gè)樣式表,它就會(huì)按照這個(gè)樣式表來對文檔進(jìn)行格式化。有以下三種方式來插入樣式表:
外部樣式表 link
當(dāng)樣式需要被應(yīng)用到很多頁面的時(shí)候,外部樣式表將是理想的選擇。使用外部樣式表,你就可以通過更改一個(gè)文件來改變整個(gè)站點(diǎn)的外觀。
<head>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
link : 定義資源引用
rel : 告訴瀏覽器引用的是一個(gè)樣式表文件
type : 文件類型
href : 文件地址
內(nèi)部樣式表
當(dāng)單個(gè)文件需要特別樣式時(shí),就可以使用內(nèi)部樣式表。你可以在 head 部分通過 <style> 標(biāo)簽定義內(nèi)部樣式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
style : 定義樣式定義
新建一個(gè)前端學(xué)習(xí)qun438905713,在群里大多數(shù)都是零基礎(chǔ)學(xué)習(xí)者,大家相互幫助,相互解答,并且還準(zhǔn)備很多學(xué)習(xí)資料,歡迎零基礎(chǔ)的小伙伴來一起交流。
內(nèi)聯(lián)樣式
當(dāng)特殊的樣式需要應(yīng)用到個(gè)別元素時(shí),就可以使用內(nèi)聯(lián)樣式。 使用內(nèi)聯(lián)樣式的方法是在相關(guān)的標(biāo)簽中使用樣式屬性。樣式屬性可以包含任何 CSS 屬性。以下實(shí)例顯示出如何改變段落的顏色和左外邊距。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
優(yōu)先級說明
(外部樣式)External style sheet < (內(nèi)部樣式)Internal style sheet < (內(nèi)聯(lián)樣式)In
1.下列方法表示調(diào)用外部樣式表的是?
A<style type="text/css">h1 {color: red }</style>
B<link rel="stylesheet" type="text/css" href="css/style.css">
C<p style="color: red; margin-left: 20px">style</p>
2.下面三種方法可以起到改變文檔樣式的是?
A<style type="text/css">h1 {color: red }</style>
B<link rel="stylesheet" type="text/css" href="css/style.css">
C<p style="color: red; margin-left: 20px"></p>
D以上三種都可以
————————————————
版權(quán)聲明:本文為CSDN博主「html前端基礎(chǔ)入門教程」的原創(chuàng)文章,遵循 CC 4.0 BY-SA 版權(quán)協(xié)議,轉(zhuǎn)載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/htkms87/article/details/104600003
藍(lán)藍(lán)設(shè)計(jì)的小編 http://tweetduck.com