html style標籤是什麼意思？關於style標籤的使用方法詳解
- 寻∝梦原創
- 2018-08-22 13:58:3916413瀏覽
這篇文章主要講的是html style標籤的定義和屬性介紹，先讓我們了解style標籤在HTML中的一些用途和位置，然後介紹了使用中的一些方法和細節技巧，讓我們一起來看看吧
html style標簽的定義和用法：
c9ccee2e6ea535a969eb3f532ad9fe89 標籤用於為HTML 文件定義樣式資訊。
在 style 中，您可以規定在瀏覽器中如何呈現 HTML 文件。
type 屬性是必要的，定義 style 元素的內容。唯一可能的值是 "text/css"。
style 元素位於 head 部分。
HTML c9ccee2e6ea535a969eb3f532ad9fe89 標籤實例：##
<html>
<head>
<style type="text/css">
h1 {color:red}
p {color:blue}
</style>
</head>
<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>必要的屬性：type ： text/css ： 規定樣式表的 MIME 類型。
html style標籤的使用方法詳解：
#531ac245ce3e4fe3d50054a55f265927標籤對中書寫各種標籤的樣式,可以是body也可以是h1,即將行內樣式全寫在一塊兒比如10個標籤都是同一個class的話，如果在行內樣式中就需要寫10條而在style中寫一條就成。 現在都是結構(html)、樣式(css)、行為(js)相分離的設計模式<p id="xxx">===><style>#xxx{}</style>
<p class="xxx">===><style>.xxx{}</style>
<body></body>===><style>body{}</style>
style標籤在css樣式表中按其所在位置分三種：
1.內嵌樣式表2.內部樣式表3.外部樣式表下面詳細解釋一下：1.內嵌樣式表是寫在使用它的標籤(Tag)內的，例如要在e388a4556c0f65e1904146cc1a846bee標籤中使用，
其語法為：<p style font-size:20pt>这段文字使用了内嵌样式表，更改了字体大小为20</p>
2.內部樣式表不同於內嵌樣式表，其是寫在html網頁的93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1標籤之間的，所以它對本網頁全部有效。要注意的是，因為它不是寫在某一個標籤內的，所以在寫的時候要注意，自己想在那個標籤內使用這個樣式表，再定義的時候也要寫清楚，否則會造成整個頁面的混亂。例如：
<html>
<head>
p.mylayout <style type="text/css">{font-size:22pt; color:blue; border-width:1px; border:double; text-align:center; }</style></head>
<body>
<p class="mylayout">这段文字使用了样式表</p>
<p>这段文字没有使用样式表</p>
</body>
</html>可以看到，在定義內部樣式表的時候，c9ccee2e6ea535a969eb3f532ad9fe89前面聲明的時候應該首先聲明在哪個標籤裡使用這個樣式表，如果並不想在該網頁所有的此標籤中都使用這個樣式表則在聲明的標籤後面加上自己定義的一個樣式表名稱，例如上面的p.mylayout，意為只能在該網頁的e388a4556c0f65e1904146cc1a846bee標籤中使用此樣式表，在要使用這個樣式表的e388a4556c0f65e1904146cc1a846bee標籤中聲明，聲明方式為96d98c7e34310f0d0a4883da8c17d425利用樣式表選擇，你可以用同樣的HTML標籤構成不同的樣式。比如說，你希望段落e388a4556c0f65e1904146cc1a846bee有兩種樣式，一種是居中對齊，一種是居右對齊。你就可以寫如下樣式：p.right {text-align:right}
p.center {text-align:center}其中right和center就是兩個樣式表。然後你就可以引用這兩個樣式表，範例程式碼如下：<p class="center">这一段居中显示。</p> <p class="right">这一段是居右显示。</p>也可以不用HTML 標籤，直接用「.」加上樣式表名稱。範例程式碼如下：
.center {text-align: center}這種通用的樣式表名稱就沒有標籤的局限性，可以用於不同的標籤。例如：<h1 class = "center">这个标题居中显示。</h1> <p class = "center">这个段落居中显示。</p>
3.外部樣式表
外部樣式表就是將樣式表的內容單獨寫到一個notepad中，並儲存為後綴為.css的文件，在你寫的想要呼叫的網頁中加上如下的程式碼（當然還是加到93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1之間）：<link href="你css文件所在的文件夹" rel="stylesheet" type="text/css">例如：
##先寫一段程式碼並存為p.css
p.mylayout {font-size:20pt; border-width:1px; color:blue; }然後在你寫的網頁中調用這個樣式表：
<HTML> <head> <link href="p.css所在的相对路径" rel="stylesheet" type="text/css"> </head> <body> <p class="mylayout"> 这个标题使用了Style 。</p> <p>这个标题没有使用Style。</p> </body> </HTML>
所以一個外部樣式表可以被很多網頁調用，這就是外部樣式表的好處。
樣式表也可以串聯，也就是一個網頁用多個css，其串聯的順序是：內嵌>內部>外部>瀏覽器本身的
也就是說當當一個網頁有內部css時，它在的呼叫外部css就被覆蓋了（即外部css不起作用）
css樣式表定義時的嵌套說明：
#p b {color :blue;}
使用時：
<p>这段文字在b标签中的为<b>蓝色</b></p>
cursor:hand 這個屬性是將滑鼠變成手的形狀。
【小編的相關文章】
html em標籤的作用是什麼？ 907fae80ddef53131f3292ee4f81644b和5a8028ccc7a7e27417bff9f05adf5932標籤的區別html5 output標籤是什麼意思？ html5 output標籤的使用方法以上是html style標籤是什麼意思？關於style標籤的使用方法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！