当前位置: 首页 > news >正文

九、HTML头部<head>

一、HTML头部<head>

1、<title>- 定义了HTML文档的标题

使用 <title> 标签定义HTML文档的标题

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>我的 HTML 的第一页</title>
</head><body><p>浏览器中包含body元素的内容。</p><p>浏览器的标题包含title元素的内容</p>
</body></html>

运行结果:

2、<base> - 定义了所有链接的URL

使用 <base> 定义页面中所有链接默认的链接目标地址。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><base href="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" target="_blank">
</head><body><img src="PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png"> - 注意这里我们设置了图片的相对地址。能正常显示是因为我们在 head 部分设置了 base标签,该标签指定了页面上所有链接的默认 URL,所以该图片的访问地址为"https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png"<br><br><a href="https://www.baidu.com/">百度一下</a> - 注意这个链接会在新窗口打开,即便它没有 target="_blank" 属性。因为在 base 标签里我们已经设置了 target 属性的值为"_blank"。</body></html>

运行结果:

 3、<meta> - 提供了HTML文档的meta标记

使用 <meta> 元素来描述HTML文档的描述,关键词,作者,字符集等。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title><meta> - 提供了HTML文档的meta标记</title><meta name="description" content="免费在线教程"><meta name="keywords" content="HTML,CSS,XML,JavaScript"><meta name="author" content="runoob">
</head><body><p>所有 meta 标签显示在 head 部分...</p></body></html>

二、HTML <head> 元素

<head> 元素包含了所有的头部标签元素。在 <head>元素中你可以插入脚本(scripts), 样式文件(CSS),及各种meta信息。

可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript> 和 <base>。

三、HTML <title> 元素

<title> 标签定义了不同文档的标题。

<title> 在 HTML/XHTML 文档中是必需的。

<title> 元素:

  • 定义了浏览器工具栏的标题
  • 当网页添加到收藏夹时,显示在收藏夹中的标题
  • 显示在搜索引擎结果页面的标题

一个简单的 HTML 文档:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>文档标题</title>
</head><body>文档内容......
</body></html>

四、HTML <base> 元素

<base> 标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:

<head><base href="http://www.runoob.com/images/" target="_blank">
</head>

五、HTML <link> 元素

<link> 标签定义了文档与外部资源之间的关系。

<link> 标签通常用于链接到样式表:

<head><link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

六、HTML <style> 元素

<style> 标签定义了HTML文档的样式文件引用地址.

在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:

<head>
<style type="text/css">
body {background-color:yellow;
}
p {color:blue
}
</style>
</head>

七、HTML <meta> 元素

meta标签描述了一些基本的元数据。

<meta> 标签提供了元数据.元数据也不显示在页面上,但会被浏览器解析。

META 元素通常用于指定网页的描述,关键词,文件的最后修改时间,作者,和其他元数据。

元数据可以使用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他Web服务。

<meta> 一般放置于 <head> 区域

八、<meta> 标签- 使用实例

1、为搜索引擎定义关键词:

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">

2、为网页定义描述内容:

<meta name="description" content="免费 Web & 编程 教程">

3、定义网页作者:

<meta name="author" content="Runoob">

4、每30秒钟刷新当前页面:

<meta http-equiv="refresh" content="30">

九、HTML <script> 元素

<script>标签用于加载脚本文件,如:JavaScript。

<script> 元素在以后的章节中会详细描述。

十、HTML head 元素 

相关文章:

九、HTML头部<head>

一、HTML头部<head> 1、<title>- 定义了HTML文档的标题 使用 <title> 标签定义HTML文档的标题 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>我的 HTML 的第一页</title> </head><b…...

机器学习期末复习

机器学习 选择题名词解释&#xff1a;简答题计算题一、线性回归二、决策树三、贝叶斯 选择题 机器学习利用经验 &#xff0c;须对以下&#xff08;&#xff09;进行分析 A 天气 B 数据 C 生活 D 语言 归纳偏好值指机器学习算法在学习的过程中&#xff0c;对以下&#xff08;&a…...

python-日志模块以及实际使用设计

python-日志模块以及实际使用设计 1. 基本组成 日志模块四个组成部分&#xff1a; 日志对象&#xff1a;产生日志信息日志处理器&#xff1a;将日志信息输出到指定地方&#xff0c;例如终端、文件。格式器&#xff1a;在日志处理器输出之前&#xff0c;对信息进行各方面的美化…...

googlecode.log4jdbc慢sql日志,格式化sql

前言 无论使用原生JDBC、mybatis还是hibernate&#xff0c;使用log4j等日志框架可以看到生成的SQL&#xff0c;但是占位符和参数总是分开打印的&#xff0c;不便于分析&#xff0c;显示如下的效果: googlecode Log4jdbc 是一个开源 SQL 日志组件&#xff0c;它使用代理模式实…...

Linux程序、进程和计划任务

目录 一.程序和进程 1.程序的概念 2.进程的概念 3.线程的概念 4.单线程与多线程 5.进程的状态 二.查看进程信息相关命令&#xff1a; 1.ps&#xff1a;查看静态进程信息状态 2.top&#xff1a;查看动态进程排名信息 3.pgrep&#xff1a;查看指定进程 4.pstree&#…...

【MySQL】索引基础

文章目录 1. 索引介绍2. 创建索引 create index…on…2.1 explain2.2 创建索引create index … on…2.3 删除索引 drop index … on 表名 3. 查看索引 show indexes in …4. 前缀索引4.1 确定最佳前缀长度&#xff1a;索引的选择性 5. 全文索引5.1 创建全文索引 create fulltex…...

精确管理Python项目依赖:自动生成requirements.txt的智能方法

在Python中&#xff0c;可以使用几种方法来自动生成requirements.txt文件。这个文件通常用于列出项目所需的所有依赖包及其版本&#xff0c;使其他人或系统可以轻松地重现相同的环境。下面是几种常见的方法&#xff1a; 使用pip freeze&#xff1a; 这是最常见的方法。pip free…...

JavaWeb基础(1)- Html与JavaScript(JavaScript基础语法、变量、数据类型、运算符、函数、对象、事件监听、正则表达式)

JavaWeb基础&#xff08;1&#xff09;- Html与JavaScript(JavaScript基础语法、变量、数据类型、运算符、函数、对象、事件监听、正则表达式) 文章目录 JavaWeb基础&#xff08;1&#xff09;- Html与JavaScript(JavaScript基础语法、变量、数据类型、运算符、函数、对象、事件…...

java SSM体育器材租借管理系统myeclipse开发mysql数据库springMVC模式java编程计算机网页设计

一、源码特点 java SSM体育器材租借管理系统是一套完善的web设计系统&#xff08;系统采用SSM框架进行设计开发&#xff0c;springspringMVCmybatis&#xff09;&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要…...

西电期末1030.函数的最大值

一.题目 二.分析与思路 函数打擂台&#xff0c;注意数据类型和保留精度 三.代码实现 #include<bits/stdc.h>//万能头 double f(double x,double a){return a*x*x-x*x*x; }//f(x) int main() {double a;scanf("%lf",&a);double max-1000001;//打擂台for(…...

在Docker中安装Tomact

目录 前言&#xff1a; 一.安装Tomact 查找指定的tomact版本 下载tomact9.0 查看该镜像是否安装成功 安装成功之后就开始运行镜像了 ps&#xff08;用于列出正在运行的Docker容器&#xff09; ​编辑 测试(虚拟机ip:8080) ​编辑 解决措施 ​编辑 完成以上步骤&…...

【书生大模型00--开源体系介绍】

书生大模型开源体系介绍 0 通用人工智能1 InternLM性能及模型2 从模型到应用 大模型成为目前很热的关键词&#xff0c;最热门的研究方向&#xff0c;热门的应用&#xff1b;ChatGPT的横空出世所引爆&#xff0c;快速被人们上手应用到各领域&#xff1b; 0 通用人工智能 相信使…...

基于GPT-3、ChatGPT、GPT-4等Transformer架构的自然语言处理

文章目录 一、内容简介二、前言2.1 Transformer 模型标志着AI 新时代的开始2.2 Transformer 架构具有革命性和颠覆性2.3 Google BERT 和OpenAI GPT-3 等Transformer 模型将AI 提升到另一个层次2.4 本书将带给你的“芝士”2.5 本书面向的读者 三、本书内容简介3.1 第一章3.2 第二…...

一款开源的MES系统

随着工业4.0的快速发展&#xff0c;制造执行系统&#xff08;MES&#xff09;成为了智能制造的核心。今天&#xff0c;将为大家推荐一款开源的MES系统——iMES工厂管家。 什么是iMES工厂管家 iMES工厂管家是一款专为中小型制造企业打造的开源MES系统。它具备高度的可定制性和灵…...

https配置证书

HTTPS 基本原理 https 介绍 HTTPS&#xff08;全称&#xff1a;HyperText Transfer Protocol over Secure Socket Layer&#xff09;&#xff0c;其实 HTTPS 并不是一个新鲜协议&#xff0c;Google 很早就开始启用了&#xff0c;初衷是为了保证数据安全。 国内外的大型互联网…...

图神经网络|10.4 GCN 变换原理的解读

由9.3-邻接矩阵的变换可知&#xff0c;理解矩阵通过两个度矩阵的逆进行归一化。 微观上看&#xff0c; a i j a_{ij} aij​这个元素将会乘上 1 d e g ( v i ) d e g ( v j ) \frac{1}{\sqrt{deg_(v_i)\sqrt{deg(v_j)}}} deg(​vi​)deg(vj​) ​ ​1​ 其现实意义如下—— 比如…...

计算机组成原理 I/O方式

I/O 方式 I/O方式分类: 程序查询方式。由 CPU通过程序不断查询 /O 设备是否已做好准备&#xff0c;从而控制0 设备与主机交换信息程序中断方式。只在 I/0 设备准备就绪并向 CPU发出中断请求时才予以响应。DMA方式。主存和 I/O 设备之间有一条直接数据通路&#xff0c;当主存和…...

VMWare网络配置

1、通用配置 选择自动&#xff0c;相对与选择指定网卡&#xff0c;能解决网卡更换导致网络不可用的问题。 2、每个虚拟机配置...

opencv期末练习题(3)附带解析

创建黑色画板&#xff0c;并支持两种画图功能 import mathimport cv2 import numpy as np """ 1. 创建一个黑色画板 2. 输入q退出 3. 输入m切换画图模式两种模式&#xff0c;画矩形和画圆形。用户按住鼠标左键到一个位置然后释放就可以画出对应的图像 "&qu…...

51单片机之LED灯

51单片机之LED灯 &#x1f334;前言&#xff1a;&#x1f3ee;点亮LED灯的原理&#x1f498;点亮你的第一个LED灯&#x1f498;点亮你的八个LED灯 &#x1f4cc;让LED灯闪烁的原理&#x1f3bd; LED灯的闪烁&#x1f3d3;错误示范1&#x1f3d3;正确的LED闪烁代码应该是这样&am…...

操作系统内存碎片

大家好&#xff0c;我叫徐锦桐&#xff0c;个人博客地址为www.xujintong.com&#xff0c;github地址为https://github.com/jintongxu。平时记录一下学习计算机过程中获取的知识&#xff0c;还有日常折腾的经验&#xff0c;欢迎大家访问。 一、前言 内存碎片是指无法被利用的内…...

三菱plc学习入门(二,三菱plc指令,触点比较,计数器,交替,四则运算,转换数据类型)

今天&#xff0c;进行总结对plc的学习&#xff0c;下面是对plc基础的学习&#xff0c;希望对读者有帮助&#xff0c;欢迎点赞&#xff0c;评论&#xff0c;收藏&#xff01;&#xff01;&#xff01; 目录 触点比较 当数据太大了的时候&#xff08;LDD32位&#xff09; CMP比…...

Spring学习之——代理模式

Proxy代理模式 介绍 为其他对象提供一种代理以控制对这个对象的访问。在某些情况下&#xff0c;一个对象不适合或者不能直接引用另一个对象&#xff0c;而代理对象可以在客户端和目标对象之间起到中介的作用 2. 组成 抽象角色&#xff1a;通过接口或抽象类声明真实角色实现的…...

【Linux】之搭建 PostgreSQL 环境

前言 在 Linux 系统下安装 PostgreSQL&#xff0c;可以选择快捷方便的 Docker 安装&#xff0c;但正常的服务器都是直接原生安装的&#xff0c;所以&#xff0c;这里我将讲解如何正常安装 PostgreSQL 以及安装之后的一些配置。如果想了解 Docker 安装的话&#xff0c;可以查看我…...

docker 安装elasticsearch、kibana、cerebro、logstash

安装步骤 第一步安装 docker 第二步 拉取elasticsearch、kibana、cerebro、logstash 镜像 docker pull docker.elastic.co/elasticsearch/elasticsearch:7.10.2 docker pull docker.elastic.co/kibana/kibana:7.10.2 docker pull lmenezes/cerebro:latest docker pull l…...

C/C++ 联合体

目录 联合体概述 联合体的内存分配 联合体大小计算 联合体概述 联合与结构非常的相似&#xff0c;主要区别就在于联合这两个字。 联合的特征&#xff1a;联合体所包含的成员变量使用的是同一块空间。 联合体定义 //联合类型的声明 union Un {char c;int i; }; //联合变量…...

基于SSM的基金投资交易管理网站的设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;采用JSP技术开发 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#x…...

JS数据类型转换成Boolean型

在javaScript中 布尔值用到的很频繁 接下来让我稍微为大家介绍一下数据类型转换为布尔型 转换成布尔值为false的类型 console.log(Boolean("")) //falseconsole.log(Boolean(0)) //falseconsole.log(Boolean(undefined)) //falseconsole.log(Boolean(null)) //false…...

uni-app页面数据传参方式

uni-app 是一个使用 Vue.js 开发所有前端应用的框架&#xff0c;可以编译到 iOS、Android、H5、小程序等多个平台。当你在多个页面间传递参数时&#xff0c;通常有多种方法&#xff0c;例如通过 uni.navigateTo、路由参数、本地存储等方式。下面是一些方法的说明和示例代码。 …...

计算机网络实验(二):Wireshark网络协议分析

一、实验名称&#xff1a;Wireshark网络协议分析 二、实验原理 HTTP协议分析 1.超文本传输协议&#xff08;Hypertext Transfer Protocol, HTTP&#xff09;是万维网&#xff08;World Wide Web&#xff09;的传输机制&#xff0c;允许浏览器通过连接Web服务器浏览网页。目…...

太原seo网站建设/自助建站网站哪个好

此为记录下我自己的爬虫学习过程。 利用url包抓取网页 import urllib.request #url包 def main(): url "http://www.douban.com/" response urllib.request.urlopen(url) #请求 html response.read() #获取 html html.decode("utf-8") #解码 print(htm…...

wordpress视频适应手机端/舆情服务网站

前言&#xff1a;本人将通过EJB tutorialspoint 网站学习EJB相关知识&#xff0c;并将一部分知识翻译整理写为博客&#xff0c;加入自己的见解&#xff0c;供分享和交流。 一、EJB指导 企业级Java Beans(EJB)是一种应用广泛的java 开发架构&#xff0c;用于构建高度可伸缩和…...

免费申请域名的步骤/免费培训seo网站

在做企业应用集成解决方案中&#xff0c;错误处理这一块是非常重要的一个环节&#xff0c;而相较于于自身原因导致的错误&#xff0c;调用远程服务时出现错误才是最让人头疼的&#xff0c;在人们发挥聪明才智总结出的各类解决方案中&#xff0c;重试无疑是最容易想到且实施的方…...

网站界面设计的要求/网页制作教程书籍

一开始&#xff0c;看android剪裁图片的功能&#xff0c;觉得好神奇。一张图片&#xff0c;手一划就能剪出想要的一块来&#xff0c;决定研究一下。一研究发现特别简单&#xff0c;几乎都不用敲多少代码。下面把代码列出来&#xff0c;原代码再上传一份。Activity文件内容片断&…...

免费店铺logo在线制作/优化网站排名如何

java时间操作函数汇总 src url:http://www.javaeye.com/topic/256420 经常用到时间日期类&#xff0c;所以就将常用的日期方法和属性都归纳总结如下&#xff0c;方便大家查找 1.计算某一月份的最大天数 Calendar timeCalendar.getInstance(); time.clear(); time.set(Calendar…...

海淀公司网站搭建/武汉整站优化

System.out.println(" 我可能用了假的trim   ".trim()); 结果是&#xff0c;trim用了跟没用一样。难道是我眼花了&#xff0c;看到了假的空格&#xff1f;还是我用了假的trim&#xff1f; 然后看了下jdk源码&#xff0c;发现我用的是真的trim&#xff01;&am…...