简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
首页 > web前端 > html教程 > 正文

怎么在head区域引入css

青灯夜游
发布： 2021-07-02 16:26:04
原创
3689 人浏览过

引入方法：1、使用style标签引入，语法“ ”；2、使用link引入，语法“<link rel="stylesheet" type="text/css" href="css文件路径" />”。

怎么在head区域引入css

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

在head区域引入css有两种方法：

  • 内部样式表--用style标签定义

  • 外部样式表--用link标签引入

1、内部样式表--用style标签定义

将css代码集中写在HTML文档的head头部标签中，并且用style标签定义，其基本语法格式如下：

<head>  
<style type="text/css"> 
css代码
</style> 
</head>
登录后复制

语法中，style标签一般位于head标签之后，也可以把它放在HTML文档中的任何地方。

css代码的一般格式：

css选择器{ 
  属性:值;
  属性:值;
  .....
}
登录后复制

2、外部样式表--用link标签引入

将所有的样式放在一个或多个以CSS为扩展名的外部样式表文件中，通过link标签将外部样式链接到HTML文档中，其基本语法格式如下：

<link rel="stylesheet" type="text/css" href="css文件路径" />
登录后复制

  • rel属性：定义当前文档与别链接文档之间的关系，"stylesheet"表示：被链接的文档是一个样式表文件

  • href属性：定义所链接的外部样式表文件的URL，可以是相对路径，也可以是绝对路径

（学习视频分享：css视频教程、html视频教程）

以上是怎么在head区域引入css的详细内容。更多信息请关注PHP中文网其他相关文章！

相关标签：
css head html
来源：php.cn
上一篇：html文本区域大小怎么设置 下一篇：html如何调用外部css
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
JavaScript 允许访问 CSS 自定义属性（也称为 CSS 变量） 如何使用JavaScript（普通或jQuery）获取和设置CSS自定义属性（通过样式表中的var(…)访问的属性）？这是我不成功的尝试：单击按钮会更改通常的font-weight...
来自于 2023-10-20 22:42:04
0
2
244
创建 HTML 电子邮件时是否需要包含 html、head 和 body 标签？ 在我的电子邮件视图中，我通常只会做类似的事情<dl><dt>Name</dt><dd>Value</dd></dl...
来自于 2023-10-17 16:56:57
0
1
265
如何在VS Code中选择和删除HTML元素（标签和内容）？ 首先，有一个"Emmet:RemoveTag"功能，但它只会删除特定标签的包装。它不会删除包括其中的子元素在内的整个元素。我正在寻找能够同时删除子元素的相同操作...
来自于 2023-09-19 10:55:17
0
1
361
如何使头部的图片、文字和按钮具有响应式 我正在使用Bootstrap5制作一个网站。在网站的标题中，我使用Bootstrap中的轮播作为我的标题。轮播图像还允许显示文本和按钮。我希望图像、文本和按钮具有响应能力。我尝试使...
来自于 2023-09-17 09:51:15
0
1
283
在vue中使用@click.prevent方法后，页面未显示内容 有人能找出问题可能来自哪里吗？？我没有收到任何错误，但是页面没有显示内容我正在尝试在不导航到页面的情况下显示页面的内容，但是当我点击链接时它不显示它们<!DOCTYPEhtm...
来自于 2023-09-16 22:12:27
0
1
333
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！