Html的头部标签meta怎么用
admin
2023-02-12 09:20:06
0次

本文以Html的头部标签meta为例,为大家分析meta标签的属性以及meta标签的使用,阅读完整文相信大家对Html的头部标签meta有了一定的认识。

meta元素有4个属性:name、http-equiv、content、charset.meta标签通过name属性来表述页面文档的元信息,通过http-equiv属性设置http请求指令,通过charset设置页面的字符编码。按照属性设置分类,meta可以分为三类:

name属性和content属性组合,构成名称/值对,用于描述网站信息.

标准的meta名称包括application-name、author、description、generator等。 示例代码:

其中keywords和description这两个名称的使用率最高,是搜索引擎优化的主要手段之一,推荐读者使用。

http-equiv属性和content属性组合,设置特定的http指令;

其中content-type、default-style和refresh已经确定,content-language和set-cookie还未正式确定.

此类型meta应该谨慎使用。不推荐使用,某些搜索引擎遇到此meta时会停止解析 页面剩余的部分。在实际的场景中很少使用

charset属性,设置页面字符编码。

此属性提供了保存和传输文档的编码格式。

等价于

但是第一种形式更简洁好记,并且得到了所有主流浏览器的支持,所有不存在浏览器兼容问题。为 了让浏览器能准确识别编码格式,务必在标签之前设置charset,保证标题能正确显示。</p><blockquote><p>除了W3C定义的规范中定义的这些meta之外,还有大量的自定义meta类型。这些meta类型主要是由互联网公司或者浏览器厂商为了实现特定的功能而定制的。这些自定义的meta不能通过W3C提供的标准校验,但并不是说这些meta不标准。介绍一些常用的meta</p></blockquote><p><strong>设置IE浏览器的兼容模式</strong></p><p>从IE8浏览器开始支持一种设置页面兼容模式的meta类型</p><p>根据html规范,浏览器是按照页面开头定义的文档类型来解析页面的。例如,使用html5的文档类型声明:</p><pre><code><!DOCTYPE html></code></pre><p>IE就会以标准模式解析HTML文档。但是某些已有页面由于各种原因不能在最新标准模式下正确显示,只支持特定的标准。针对这种情况,IE浏览器提供了一种兼容的方案,通过设置X-UA-Compatible指定页面在IE浏览器中渲染时执行的标准。</p><p>此外还有一种很常见的设置值,即:</p><pre><code><meta http-equiv="X-UA-Compatible" content="chrome=1"/></code></pre><p>IE定义的meta为什么会出现chrome呢?其实设置为chrome=1时,则会在IE9及以下浏览器中激活Chrome Frame,强制IE使用Chrome Frame渲染页面。</p><p>看完上述内容,你们对<span >Html的头部标签meta</span>有进一步的了解吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注行业资讯频道,感谢各位的阅读。</p><p> </p> <!--end::Text--> </div> <!--end::Description--> <div class="mt-5"> <!--关键词搜索--> </div> <div class="mt-5"> <p class="fc-show-prev-next"> <strong>上一篇:</strong><a href="/kaifa/show-104043.html">cocos2dx中的核心类是什么</a><br> </p> <p class="fc-show-prev-next"> <strong>下一篇:</strong><a href="/kaifa/show-104045.html">web前端入门到实战:CSS的文本格式化样式总汇</a> </p> </div> <!--begin::Block--> <div class="d-flex flex-stack mb-2 mt-10"> <!--begin::Title--> <h3 class="text-dark fs-5 fw-bold text-gray-800">相关内容</h3> <!--end::Title--> </div> <div class="separator separator-dashed mb-9"></div> <!--end::Block--> <div class="row g-10"> </div> </div> <!--end::Table widget 14--> </div> <!--end::Col--> <!--begin::Col--> <div class="col-xl-4 mt-0"> <!--begin::Chart Widget 35--> <div class="card card-flush h-md-100"> <!--begin::Header--> <div class="card-header pt-5 "> <!--begin::Title--> <h3 class="card-title align-items-start flex-column"> <!--begin::Statistics--> <div class="d-flex align-items-center mb-2"> <!--begin::Currency--> <span class="fs-5 fw-bold text-gray-800 ">热门资讯</span> <!--end::Currency--> </div> <!--end::Statistics--> </h3> <!--end::Title--> </div> <!--end::Header--> <!--begin::Body--> <div class="card-body pt-3"> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537931.html" class="text-dark fw-bold text-hover-primary fs-6">空调连续工作多久需要停机休息</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">空调连续工作的时间取决于多个因素,包括空调的型号、功率、使用环境和维护情况等。一般来说,空调可以连续...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537930.html" class="text-dark fw-bold text-hover-primary fs-6">空调哪个符号是除湿的</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">空调除湿功能通常用一个水滴形状的符号表示。不同品牌和型号的空调遥控器可能会有所差异,但一般来说,除湿...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537929.html" class="text-dark fw-bold text-hover-primary fs-6">格力空调多长时间加一次氟利昂</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">1、一般情况下,空调对氟利昂的使用量是非常小的,所以在空调使用了四年左右的时候再考虑加也没问题。2、...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537928.html" class="text-dark fw-bold text-hover-primary fs-6">空调用多长时间需要加氟一次</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">一般情况下是五年。当出现以下这几种情况时,空调才需要加氟。1、空调的室内机和室外机各有两个接口,当接...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/202609/83c0c0800a58e3b.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/show-14537927.html" class="text-dark fw-bold text-hover-primary fs-6">格调生活·C标思享荟:卡萨帝在...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">9月12日的郑州龙湖金融岛,夜风轻拂,灯光璀璨。“C标时刻共传奇——卡萨帝思享荟暨20周年品牌盛典郑...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/202609/bd5bdfc6ba7da8c.jpg')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/news/show-14537926.html" class="text-dark fw-bold text-hover-primary fs-6">品牌价值破千亿、高端份额持续领...</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">9月12日,“C标时刻共传奇——卡萨帝思享荟暨20周年品牌盛典郑州站”在郑州龙湖金融岛举办。2026...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537925.html" class="text-dark fw-bold text-hover-primary fs-6">空调主板坏了修800还是换新的</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">空调主板坏了是修还是换新,需要考虑多个因素,以下是一些建议:1. 维修成本:如果维修费用较低,比如 ...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537924.html" class="text-dark fw-bold text-hover-primary fs-6">空调开多久需要休息多长时间</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">问题:空调开多久需要休息多长时间回答:1、在使用空调的过程中,一般空调开7~8个小时左右需要休息2~...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537923.html" class="text-dark fw-bold text-hover-primary fs-6">中央空调多长时间清洗一次</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">1、一般空调开机前清洗一次即可,空调开机中间时段再清洗一次,空调关机时清洗一次,这样比较合理。2、空...</span> </div> <!--end::Title--> </div> <!--begin::Item--> <div class="d-flex flex-stack mb-7"> <!--begin::Symbol--> <div class="symbol symbol-60px symbol-2by3 me-4"> <div class="symbol-label" style="background-image: url('/uploadfile/[db:缩略图]')"></div> </div> <!--end::Symbol--> <!--begin::Title--> <div class="m-0"> <a href="/weixiu/show-14537922.html" class="text-dark fw-bold text-hover-primary fs-6">中央空调氟利昂多久加一次</a> <span class="text-gray-600 fw-semibold d-block pt-1 fs-7">看空调制热和制冷程度,很多人的观点认为氟利昂必须一年放一次,其实这个观点是错误的,理解上面有点偏差,...</span> </div> <!--end::Title--> </div> </div> <!--end::Body--> </div> <!--end::Chart Widget 35--> </div> <!--end::Col--> </div> </div> <!--end::Content container--> </div> <!--end::Content--> </div> <!--end::Content wrapper--> <!--begin::Footer--> <div id="kt_app_footer" class="app-footer"> <!--begin::Footer container--> <div class="app-container container-xxl d-flex flex-column flex-md-row flex-center flex-md-stack py-3"> <!--begin::Copyright--> <div class="text-dark order-2 order-md-1"> <span class="text-muted fw-semibold me-1">2026 ©</span> 太卓网<a href="http://www.yexian114.com/">叶县生活网</a> <a href="https://www.wxx86.cn/">编程知识网</a> <a href="http://www.kcwzh.com/">开创游戏网</a> <a href="https://www.caiding5.net">菜丁网</a><a href="http://cn.office369.com">奥飞商务网</a> <a href="http://www.zlnznjj.com/">众乐知识网</a><a href="http://www.lhjia.com/">乐活家</a><a href="http://www.nengyuan100.com/">能源100网</a> <a href="http://it.tdroid.net/">泰达科技</a><a href="http://cn.tdroid.net/">太卓开发网</a><a href="http://cn.yuansudz.com/">元素科技网</a><a href="http://www.80hlw.com/">八零商务网</a><a href="http://game.tdroid.net/">土豆游戏网</a> </div> <!--end::Copyright--> <!--begin::Menu--> <ul class="menu menu-gray-600 menu-hover-primary fw-semibold order-1"> <li class="menu-item"> <a href="/news" target="_blank" class="menu-link px-2">科技资讯</a> </li> <li class="menu-item"> <a href="/jishu" target="_blank" class="menu-link px-2">技术分享</a> </li> <li class="menu-item"> <a href="/kaifa" target="_blank" class="menu-link px-2">程序开发</a> </li> <li class="menu-item"> <a href="/weixiu" target="_blank" class="menu-link px-2">设备维修</a> </li> </ul> <!--end::Menu--> </div> <!--end::Footer container--> </div> <!--end::Footer--> </div> <!--end:::Main--> </div> <!--end::Wrapper--> </div> <!--end::Page--> </div> <!--end::App--> <div id="kt_scrolltop" class="scrolltop" data-kt-scrolltop="true"> <!--begin::Svg Icon | path: icons/duotune/arrows/arr066.svg--> <span class="svg-icon"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <rect opacity="0.5" x="13" y="6" width="13" height="2" rx="1" transform="rotate(90 13 6)" fill="currentColor"></rect> <path d="M12.5657 8.56569L16.75 12.75C17.1642 13.1642 17.8358 13.1642 18.25 12.75C18.6642 12.3358 18.6642 11.6642 18.25 11.25L12.7071 5.70711C12.3166 5.31658 11.6834 5.31658 11.2929 5.70711L5.75 11.25C5.33579 11.6642 5.33579 12.3358 5.75 12.75C6.16421 13.1642 6.83579 13.1642 7.25 12.75L11.4343 8.56569C11.7467 8.25327 12.2533 8.25327 12.5657 8.56569Z" fill="currentColor"></path> </svg> </span> <!--end::Svg Icon--> </div> <!--begin::Javascript--> <script>var hostUrl = "/static/default/pc/";</script> <!--begin::Global Javascript Bundle(mandatory for all pages)--> <script src="/static/default/pc/plugins/global/plugins.bundle.js"></script> <script src="/static/default/pc/js/scripts.bundle.js"></script> <!--end::Global Javascript Bundle--> <!--end::Javascript--> </body> <!--end::Body--> </html>