html< style>标签笔记

原创 PHP笔记  2017-08-29 13:18  阅读 1,810 views 次

<style>标签定义及用法

1、在html中,<style>标签是用来定义html文档的样式信息,通常在<style>标签中定义元素在浏览器中的显示效果(视觉效果)。

2、通过<link>标签可以引入外部样式表(样式信息),这种方式比直接将样式表写在html文档更好,有利于文档的结构、seo、二次开发等。

3、如果没有使用"scoped"属性,<style>标签必须位于<head>标签内部区域。"scoped"属性是 html5中的新增属性,允许我们为文档的指定部分定义样式,而不是整个文档。如果使用 "scoped" 属性,那么所规定的样式只能应用到style元素的父元素及其子元素。

<style>标签基本属性

  • media:为样式表规定不同的媒体类型(值:media_query)。
  • scoped:使用该属性,样式仅仅应用到style元素的父元素及其子元素(值:scoped)。
  • type:样式表的MIME类型(值:text/css)。

<style>标签支持html全局属性和html事件属性

格式:

<style type="text/css">
选择器{
属性:值;
......
}
......
</style>

实例;

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html< style>标签笔记</title>
<style type="text/css">
h1{color:red;}
p{color:green;}
</style>
</head>
<body>
<h1>我是一个标题</h1>
<p>我是一个段落,我是一个段落</p>
</body>
</html>

运行结果:

本文地址:https://www.ggbiji.com/html-style-2.html
版权声明:本文为 PHP笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情