HTML头部相关知识

作者: YukiWeng | 来源:发表于2019-03-20 12:19 被阅读5次

HTML头部

  • <head>标签中的内容不会在浏览器中显示,作用:包含一些页面的元数据
  • 元数据:描述数据的数据
<head>
<meta charset="utf-8">
<title>第一篇博客</title>
</head>

元数据<meta>

有个好玩的例子:
<Meta http-equiv="Refresh"Content="3;Url=http://www.baidu.com">
提留三秒后,自动跳转到百度首页。

  • 指定文档编码

<meta charset="utf-8">

  • 适配移动页面

<meta name="viewport" content="width=device-width, initial-scale=1.0">

具体解释可查看以下链接:
meta name="viewport" content="width=device-width,initial-scale=1.0" 解释

  • 定制页面图标

有两种方法(详见 用link标签实现 shortcut icon(给网页标题前添加一个小图标favicon.ico)

  1. <link rel="shortcut icon " type="images/x-icon" href="./favicon.ico">
    其中favicon.ico需放在根目录下面(不提倡用这种方法,因为图片没有授权,违反了W3C标准)

  2. <link rel="shortcut icon " type="images/x-icon" href="http://www.jd.com/favicon.ico">

  • 设置 referer

<meta name="referrer" content="never">

referrer就是来源、来路的意思
content有四個參數:
"never" "always" "origin" "default"

比如有A页面和B页面,A页面有一个链接链到了B页面,
A页面:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="referrer" content="always">
<title>a</title>
</head>
<body>
<a href="b.html">b</a>
</body>
</html>

B页面:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>b</title>
</head>
<body>
<script>
console.log(document.referrer);
</script>
</body>
</html>

当A页面<meta name="referrer" content="always">的值为always时,B页面能取得他从哪个页面来;
当A页面<meta name="referrer" content="never">的值为never时,B页面无法取得他是从哪个页面来的,加载不出来。

(比如说百度贴吧有些图片设置了链接权限,不开放非相关网页)

  • 添加页面描述

<meta name="description" content="文字描述内容">

  • 应用 CSS 和 JS

<link rel="stylesheet" href="app.css">
<script src="app.js"></script>

相关文章

  • HTML头部相关知识

    HTML头部 标签中的内容不会在浏览器中显示,作用:包含一些页面的元数据 元数据:描述数据的数据 元数据

  • url头部斜杠的区别

    在当前网页点击a标签进行跳转,或者在html中设置静态资源的链接都要用到url的相关知识。 但是url的头部 /...

  • html相关知识!!!

    现在html已经升级到html5了,html4与html5有很多相同的地方,也有很多不同的地方,今天小编想为大家整...

  • HTML 相关知识

    1.table布局 cellpadding:单元格与内容的填充距离cellspacing:单元格之间的距离cols...

  • HTML相关知识

    HTML、XML、XHTML 有什么区别 HTML是一种超文本标记语言,语法松散,不严格的web语言。 XML是可...

  • HTML相关知识

    1. HTML、XML、XHTML 有什么区别? HTML,超文本标记语言,是语法较为松散的、不严格的Web语言;...

  • HTML相关知识

    HTML、XML、XHTML的区别 HTML是一种超文本标记语言,语法较为松散,不规范。 XML是一种可扩展标记语...

  • HTML相关知识

    1、HTML、XML、XHTML 有什么区别 HTML(HyperText Markup Language):超文...

  • HTML相关知识

    W3C 简介 万维网联盟(英语:WorldWideWebConsortium,缩写W3C),又称W3C理事会,是万...

  • HTML相关知识总结

    声明为html5的版本,有助于浏览器正确显示网页。 一、HTML元素 1、 HTML...

网友评论

    本文标题:HTML头部相关知识

    本文链接:https://www.haomeiwen.com/subject/dsdzmqtx.html