• HTML头部<head>学习


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

    以下标签都可以添加到 head 部分:

    1.title:定义文档的标题,是必须有的元素

    <title>在这里写上文档标题</title>
    

    2base:为页面上的所有链接规定默认地址或默认目标

    /*必须的属性*/
    href     规定页面中所有相对链接的基准 URL
    <base href="http://yeching.info" />
    /*可选属性*/
    target    在何处打开页面中所有的链接,该属性会被每个链接中的 target 属性覆盖
    /*可能的值:*/
    _blank , _parent ,_self,_top
    <base target="_blank" />
    

    3.link:定义文档与外部资源之间的关系。一般用于链接外部样式表,

    <link rel="stylesheet" type="text/css" href="style.css" />
    /*常用的属性*/
    rel:必需。定义当前文档与被链接文档之间的关系。
    type:规定被链接文档的 MIME 类型
    href:规定被链接文档的位置
    media:规定被链接文档将被显示在什么设备上,主要用在媒体查询功能中
    <link rel="stylesheet"  media="only screen and (min- 480px)" href="styles.css" />
    /*其他:*/
    <link rel="shortcut icon" href="img/favicon.ico"/>
    <link rel="apple-touch-icon" href="img/touchicon.png"/>
    

    4.meta:元数据(Metadata)是数据的数据信息。META标签用来描述一个HTML网页文档的属性,例如作者、日期和时间、网页描述、关键词、页面刷新等。元数据不会显示在客户端,会被浏览器解析。元数据可以被使用浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 Web 服务调用。搜索引擎优化排名等网络营销方法内容中,通常都要谈论META标签的作用

    /*常见用法*/
    1.说明主页制作所使用的文字以及语言
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <meta charset="utf-8" />HTML5中的用法
    2.定义文档关键词
    <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
    3.定义web页面描述
    <meta name="description" content=" Web about HTML and CSS">
    4.定义页面作者
    <meta name="author" content="yeching">
    5.每30秒刷新页面
    <meta http-equiv="refresh" content="30">
    6.设定网页的到期时间,一旦过期则必须到服务器上重新调用
    <meta http-equiv="expires" content="31 Dec 2016">
    7.设定可视区
    <meta name="viewport" content="width=device-width"  initial-scale=1.0 />
    /*常用属性*/
    content:content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。content 属性始终要和 name 属性或 http-equiv 属性一起使用。
    http-equiv:为名称/值对提供了名称。并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对。
    name:name 属性提供了名称/值对中的名称。通常情况下,您可以自由使用对自己和源文档的读者来说富有意义的名称。
    charset(HTML5):定义文档的字符编码。
    

    **5.script **:定义了客户端的脚本文件

    1.插入代码
    <script type="text/javascript">
    /*在这里写你的代码*/
    </script> 
    <script>
    /*默认就是JavaScript,不写type="text/javascript"也可以*/
    /*在这里写你的代码*/
    </script> 
    2.规定外部脚本的 URL
    <script src="myscripts.js"></script> 
    /*可用的属性*/
    async(HTML5):规定异步执行脚本(仅适用于外部脚本)。
    
    charset:规定在脚本中使用的字符编码(仅适用于外部脚本)。常见的utf-8
    
    defer:规定当页面已完成解析后,执行脚本(仅适用于外部脚本)。
    
    src:规定外部脚本的 URL。
    
    type:规定脚本的 MIME 类型。默认JavaScript
    
    

    6.style:义 HTML 文档的样式信息

    <style type="text/css">
    /*在这里写样式*/
    h1 {color:red;}
    p {color:blue;}
    </style> 
    

    总结

    <head>
    <meta charset="utf-8"/>
    <title>head 使用</title>
    <base href=" " />
    <base target=" " />
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta name="viewport" content="width=device-width"/>
    <meta name="author" content=" ">
    <meta name="viewport" content="width=device-width" initial-scale=1.0 />
    <link rel="stylesheet" href="css/style.css"/>
    <link rel="shortcut icon" href="img/favicon.ico"/>
    <link rel="apple-touch-icon" href="img/touchicon.png"/>
    <style type="text/css">/*在这里写样式*/</style>
    <script>/*在这里写你的代码*/</script> 
    </head>
    
  • 相关阅读:
    在一页纸上打印8页PPT讲义的方法
    如何用XML数据绑定前台Repeater
    ASP.net中导出Excel的简单方法
    鼠标浮上JS自动弹窗
    通过拖动百度地图的添加覆盖物获取所在地的经纬度坐标
    void FillSolidRect(lpRect,clr)无效原因现象。
    WM_DRAWITEM与DrawItem()的讨论
    自绘控件 CSatic无法响应OnDrawItem
    【原创】CListCtrl和CImageList显示缩略图,图片自动排列。
    【转】VC改变对话框按钮字体颜色和背景的解决方案
  • 原文地址:https://www.cnblogs.com/YeChing/p/6243746.html
Copyright © 2020-2023  润新知