本篇文章主要讲的是html style标签的定义和属性介绍，先让我们了解style标签在html中的一些用途和位置，然后介绍了使用中的一些方法和细节技巧，让我们一起来看看吧
html style标签的定义和用法：
在 style 中，您可以规定在浏览器中如何呈现 HTML 文档。
type 属性是必需的，定义 style 元素的内容。唯一可能的值是 "text/css"。
style 元素位于 head 部分中。
HTML
<style>
h1 {color:red}
p {color:blue}
</style><h1>Header 1</h1>
<p>A paragraph.</p>
必需的属性：
type ： text/css ： 规定样式表的 MIME 类型。
html style标签的使用方法详解：
标签对中书写各种标签的样式,可以是body也可以是h1,即将行内样式全写在一块儿
比如10个标签都是同一个class的话，如果在行内样式中就需要写10条
而在style中写一条就成。
现在都是结构(html)、样式(css)、行为(js)相分离的设计模式
<p>===><style>#xxx{}</style></p><p>===><style>.xxx{}</style></p>===><style>body{}</style>
style标签在css样式表中按其所在位置分三种：
1.内嵌样式表
2.内部样式表
3.外部样式表
下面详细解释一下：
1.内嵌样式表是写在使用它的标签(Tag)内的，例如要在
标签中使用，
其语法为：
<p>这段文字使用了内嵌样式表，更改了字体大小为20</p>
2.内部样式表不同于内嵌样式表，其是写在html网页的
标签之间的，所以它对本网页全部有效。应注意的是，因为它不是写在某一个标签内的，所以在写的时候要注意，自己想在那个标签内使用这个样式表，再定义的时候也要写清楚，否则会造成整个页面的混乱。例如：
p.mylayout <style>{font-size:22pt; color:blue; border-width:1px; border:double; text-align:center; }</style>
<p>这段文字使用了样式表</p>
<p>这段文字没有使用样式表</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill10595" title="htmlppt.skill"><img
src="https://img.php.cn/upload/skill/001/246/273/6adaf20d79f23518.jpg" alt="htmlppt.skill" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill10595" title="htmlppt.skill" class="overflowclass">htmlppt.skill</a>
<p class="overflowclass">把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。</p>
</div>
<a rel="nofollow" href="/xiazai/skill10595" title="htmlppt.skill" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
可以看到，在定义内部样式表的时候，
利用样式表选择，你可以用同样的HTML标签构成不同的样式。比如说，你希望段落
有两种样式，一种是居中对齐，一种是居右对齐。你就可以写如下样式：
p.right {text-align:right}
p.center {text-align:center}
其中right和center就是两个样式表。然后你就可以引用这两个样式表，示例代码如下：
<p>这一段居中显示。</p> <p>这一段是居右显示。</p>
也可以不用HTML 标签，直接用“.”加上样式表名称。示例代码如下：
.center {text-align: center}
这种通用的样式表名称就没有标签的局限性，可以用于不同的标签。比如：
<h1>这个标题居中显示。</h1> <p>这个段落居中显示。</p>
3.外部样式表
外部样式表就是将样式表的内容单独写到一个notepad中，并保存为后缀为.css的文件，在你写的想要调用的网页中加上如下的代码（当然还是加到
之间）：<link>
例如：
先写一段代码并存为p.css
p.mylayout {font-size:20pt; border-width:1px; color:blue; }
然后在你写的网页中调用这个样式表：
<link><p> 这个标题使用了Style 。</p> <p>这个标题没有使用Style。</p>
所以一个外部样式表可以被很多网页调用，这就是外部样式表的好处。
样式表也可以串联，即一个网页用多个css，其串联的顺序是：内嵌>内部>外部>浏览器自身的
也就是说当一个网页有内部css时，它在的调用外部css就被覆盖了（即外部css不起作用）
css样式表定义时的嵌套说明：
p b {color:blue;}
使用时：
<p>这段文字在b标签中的为<b>蓝色</b></p>
cursor:hand 这个属性是将鼠标变成手的形状。
【小编的相关文章】
html5 output标签是什么意思？html5 output标签的使用方法
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
