HTML head

  • HTML <head>元素

    <head>元素是元数据的容器(关于数据的数据),并放置在间<html>标记和<body>标签。 HTML元数据是有关HTML文档的数据。浏览器不显示元数据。 元数据通常定义文档标题,字符集,样式,链接,脚本和其他元信息。 HTML的元数据元数据标签有:<title><style><meta><link><script>,和<base>
  • HTML <title>元素

    <title>元素定义文档的标题,并且在所有HTML / XHTML文档中都是必需的。 <title>元素有以下作用:
    • 在浏览器选项卡中定义标题
    • 在将页面添加到收藏夹时(对着当前页面按ctrl+d)为页面提供标题
    • 在搜索引擎结果中显示该页面的标题
    <!DOCTYPE html>
              <html>
              <head>
                <title>欢迎来到菜鸟教程</title>
              </head>
              <body>
              这里是在浏览器内显示的内容......
              </body>
              </html>
    
  • HTML <style>元素

    <style>元素用于定义单个HTML页面的样式信息:
    <style>
                body {background-color: green;}
                h1 {color: red;}
                p {color: blue;}
              </style>
    
  • HTML <link>元素

    <link>元素用于链接到外部样式表:
    <style>
                body {background-color: green;}
                h1 {color: red;}
                p {color: blue;}
              </style>
    
    提示:要了解有关CSS的所有信息,请访问我们的CSS教程。
  • HTML <meta>元素

    <meta>元素用于指定使用的字符集,页面描述,关键字,作者和其他元数据。 浏览器(如何显示内容),搜索引擎(关键字)和其他Web服务使用的元数据。 定义使用的字符集:
    <meta charset="UTF-8">
    
    定义您的网页的描述:
    &l;tmeta name="description" content="提供编程的基础教程">
    
    为搜索引擎定义关键字:
    <meta name="keywords" content="HTML, CSS, XML, JavaScript,PHP,Java">
    
    定义页面的作者:
    <meta name="author" content="Jim">
    
    每10秒刷新一次文档:
    <meta http-equiv="refresh" content="10">
    
  • 控制视口

    HTML5引入了一种方法,让Web设计人员通过<meta>标记控制视口 。 视口是用户在网页上的可见区域。它随设备尺寸变化而变化。 您应该<meta>在所有网页中包含以下视口元素:
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    一个<meta>视元素对如何控制网页的尺寸和缩放浏览器的说明: width = device-width将页面宽度设置为遵循设备的屏幕宽度(具体取决于设备)。 initial-scale = 1.0部分设置浏览器首次加载页面时的初始缩放级别。
  • HTML <script>元素

    <script>元素用于定义客户端JavaScript。 这个JavaScript写的是“欢迎来到菜鸟教程” 到id =“demo”的HTML元素:
    <script>
               
              document.getElementById("demo").innerHTML = "欢迎来到菜鸟教程";
             
              </script>
              <h1 id="demo"></h1>
    
    尝试一下
    提示:要了解有关JavaScript的所有信息,请访问我们的JavaScript教程。
  • HTML <base>元素

    <base>元素指定页面中所有相对URL的基本URL。 什么意思? 打个比方说你的网站根目录下有一个images文件夹,images文件夹下有一个goods文件夹, 你就可以在你商品详情页面的head中加这样一个base:
    <base href="https://(你的域名)/images/goods" target="_blank">
    
    在body中的img 的 src 就可以这样写:
    <img src="test1.jpg" >
    
    这时候这个img 就会自动定位到/images/goods/test1.jpg 这张图片。
  • 省略<html>,<head>和<body>

    根据HTML5的标准; <html><body><head>标签可以省略。
    <!DOCTYPE html>
              <title>欢迎来到菜鸟教程</title>
              <h1>这是标题</h1>
              <p>这是段落</p>
    
    尝试一下
    注意:我们不建议省略<html><body> 标签。省略这些标记可能会导致DOM或XML软件崩溃并在旧版浏览器中产生错误(IE9)。但是,省略<head>标签已经很常见了很长一段时间。