rel="alternate" 作用

最新推荐文章于 2022-11-02 22:51:29 发布
最新推荐文章于 2022-11-02 22:51:29 发布
阅读量3.8k 收藏 1
点赞数 1
文章标签： rel alternate link
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/NARUTO_LUOLUO/article/details/51250048
版权

alternate: 替换

1. <link rel="alternate" media="only screen and (max-width: 640px)"  href=" http://m.home.com/" />

    解释：当屏幕宽度小于640px时，页面跳转到 http://m.home.com/

2. <lik rel="stylesheet" media="screen" href="http://www.home.com/screen.css" /> 首选样式

    <link rel="alternate stylesheet" media="print" href="http://www.home.com/print.css" /> 替换样式

Double崩沙卡
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
利用link标签rel="alternate stylesheet"属性实现界面动态换肤
peterlu20110415的专栏
08-09 5083
标签 rel="stylesheet"属性指定将一个样式表立即应用到文档. rel="alternate stylesheet"属性将其作为备用样式表而在默认情况下禁用它   通过js拿到link标签对象,disabled属性设置,可以实现变化页面导入样式表 disa
link标签 rel=“ alternate“ 应用解析
demo_yo的博客
10-21 5270
link标签rel="alternate"属性的作用及用法： 1.链接外部样式表： <link rel="alternate" type="text/css" href="out.css"> rel属性定义当前.html文档与被链接的.css文档之间的关系。 rel=“stylesheet” 表示当前文档的外部样式表。 rel=“alternate” 表示当前文档的可替换样式表。 2.联合使用： <link rel="stylesheet" type="text/css" href
站点的rel="alternate"属性
weixin_30532837的博客
07-18 545
概述 今天看决战平安京官网源码，突然看到了rel的alternate属性，百度了一下，记录下来，供以后开发时参考，相信对其他人也有用。 PC端rel 在pc版网页上，添加指向对应移动版网址的特殊链接rel="alternate"标记，这有助于百度发现网站的移动版网页所在的位置。代码如下： <link rel="alternate" media="only screen and(max-wid...
使用 rel=alternate 移动属性优化移动网站SEO
蚁人日记
12-13 1886
前文介绍了<link>的属性rel=canonical，这是本文要介绍<link>的另一属性rel=alternate 的原因，因为这两者有着密切的对应关系。 很多人也许会问，什么是rel=alternate？我们该如何使用rel=alternate？ 其实rel=alternate是一个移动属性，如果权威（canonical）网页...
link rel=alternate网站替换功能
aucguu84008的博客
09-18 607
此方法借助HTML rel属性的alternate属性值实现。 <link href="reset.css" rel="stylesheet" type="text/css"> <link href="default.css" rel="stylesheet" type="text/css" title="默认"> &lt...
Link 标签 rel=Stylesheet的实际作用
09-25
这个标签在网页设计中起到至关重要的作用，因为它允许开发者将样式规则分离到外部文件中，从而实现页面样式的统一管理和维护。 `<link>` 标签的基本结构如下： ```html <link rel="relationship_type" type="media...
解析HTML中rel=“nofollow”的作用及rel属性的使用
12-14
此外，`rel="stylesheet"`常用于链接外部样式表，`rel="alternate"`则用于提供文档的不同版本，如打印版或移动版。 `rev`属性与`rel`相反，它定义了从目标文档到源文档的关系，但使用并不普遍，现代Web开发中更多...
-doctype-html-html-lang-en-head-meta-charset-utf-8-title-GitHub-Privacy-Stat:GitHub隐私声明-GitHub Docs <title> <meta name =“ viewport” content =“ width = device-width，initial-scale = 1”> <link rel =“ alternate icon” type =“ imagepng” href =“ a
03-24
<！... <head> <meta charset =“ utf-8” /&...link rel =” alternate icon“ type =” image / png“ href =” / assets / images / site / favicon.png“> <link rel =” icon“ type =“ image /
html5实现移动端适配完美写法
01-19
link rel=alternate media=only screen and(max-width: 640px) href=http://pc_url > 在移动版网页(http://mobile_url) 上，所需的注释应为: <link rel=canonical href=http://mobile_url > 之前的Meta...
HTML中rel属性分析
12-13
示例：`<link rel="alternate" type="application/rss+xml" href="feed.xml" />` 2. `shortcut icon`：定义快捷方式图标，通常显示在浏览器的地址栏或收藏夹中。 示例：`<link rel="shortcut icon" href="favicon...
link rel=alternate 实现网页主题切换
weixin_44240581的博客
12-17 794
灵感来源：https://www.zhangxinxu.com/wordpress/2019/02/link-rel-alternate-website-skin/ MDN：https://developer.mozilla.org/zh-CN/docs/Web/CSS/Alternative_style_sheets 换皮肤的一些方法 切换类名 <style> .light { background-color: #fff; color: #000; } .
link rel=alternate网站换肤功能最佳实现
椒盐薄荷糖
02-27 1384
by zhangxinxu from https://www.zhangxinxu.com/wordpress/?p=8512 本文可全文转载，个人网站无需授权，只要保留原作者、出处以及文中链接即可，任何网站均可摘要聚合，商用请联系授权。 一、大多数开发人员的实现 大多数前端开发人员实现网站皮肤更换功能大致下面两种方法： 一个全局class控制样式切换； 改变皮肤link元素的href地址...
使用rel=alternate ，和rel=canonical进行网站优化
易天海
12-18 820
首先为什么要在PC站（rel="alternate"）和移动站（rel="canonical"）使用该标签，该标签的作用是什么。 当你拥有独立的PC站和移动站点时，即需要使用该标签，每个PC页面只能有一个移动对应页面，反之亦然。 如何使用： 在PC站点当中,在</head>前加入 <linkrel="alternate"href="http://m.abc.com/"...
分辨率兼容学习笔记
AriesTina的博客
11-02 269
学习分辨率兼容，如何区分自适应布局和响应式布局
Google手机移动网站适配（双向注释）
weixin_33895475的博客
07-14 176
2019独角兽企业重金招聘Python工程师标准>>> ...
移动站适配rel=alternate PC页和H5页适配标注
weixin_30809173的博客
09-08 260
鉴于移动化大潮的汹涌和H5页的炫丽普及，百度针对PC页与H5页的跳转适配方式推出了最优方案：1.在pc版网页上，添加指向对应移动版网址的特殊链接rel="alternate"标记，这有助于百度发现网站的移动版网页所在的位置；2.同时在移动版网页上，添加指向对应pc版网址的链接rel="canonical"标记。 电脑端网站截图： 移动端网站截图： 如果你的网址是：pc版网址：http...
多语言站点怎样设置？
google_SEO_yang的博客
01-06 2672
花了半天时间看阿里巴巴和谷歌的资料，终于把多语言站点的设置整明白了。 多语言站点的域名选择 如果是一个多语言切换网站 下图是阿里巴巴网站的逻辑： 代码解释： rel表示relationship，canonical表示主体，alternate表示变体，amphtml是AMP站，针对网速慢的地区可以专门做AMP网站。 主页代码设置 www.alibaba.com的主页<head>里添加： <link rel="canonical" href="https:.
link引入media，通用样式失效问题
Heartnottowake的博客
03-10 507
通过media可以对不同分辨率的界面进行响应不同的样式，怎么使用很多文章都有讲解，下面说说引入后通用样式失效的问题： <link rel="stylesheet" type="text/css" media="screen and (max-width:960px)" href="link.css"> 这里设置了一个分辨率小于等于960px的一个样式表` .color { width: 100px; height: 100px; background-color: re
SEO: 使用 rel=canonical 为类似网页或重复网页指定权威网页
极客神殿
05-23 1381
如果你对 rel=canonical 还未曾了解，那么请先看一看下面这条语句： <link>标签应该知道吧，它是放在<head>里面的一个元素标记，该标签定义文档与外部资源的关系。而rel是<link>标签里面的一个属性，canonical则是rel的属性值。 好了，现在进入正题，说明 rel=canonical 的重要性以及如何使用该属性。 使用 rel=canonical 为类似网页或重复网页指定权威网页 如果你的某一个网页可通过多个网址访问，或者你的不同网页包
<link rel="alternate" href="/atom.xml" title="重新部署一个hexo个人博客测试" type="application/atom+xml">
最新发布
07-11
您好！非常抱歉，我无法直接帮助您重新部署一个 Hexo 个人博客测试。作为一个文本生成模型，我无法执行实际的代码操作。但是，我可以为您提供一些指导来重新部署 Hexo 博客。 首先，您可以按照以下步骤重新部署 Hexo 个人博客： 1. 确保您已经安装了 Node.js 环境和 Git 工具。 2. 打开终端或命令提示符，并使用以下命令安装 Hexo： ```shell npm install -g hexo-cli ``` 3. 创建一个新的 Hexo 博客项目： ```shell hexo init myblog cd myblog npm install ``` 4. 配置 Hexo 博客： 在项目根目录下找到 `_config.yml` 文件，并根据您的需要进行配置。您可以设置博客标题、作者信息、主题等。 5. 创建新的文章： 使用以下命令创建新的文章： ```shell hexo new "My First Post" ``` 这将在 `source/_posts` 目录下创建一个名为 `my-first-post.md` 的 Markdown 文件。 6. 编辑文章： 使用 Markdown 编辑器或文本编辑器编辑新创建的文章文件，添加您的内容。 7. 预览博客： 使用以下命令启动本地服务器并预览博客： ```shell hexo server ``` 在浏览器中访问 `http://localhost:4000` 即可查看您的博客。 8. 部署博客： 当您准备好将博客部署到服务器或静态托管平台时，可以使用以下命令生成静态文件并部署： ```shell hexo generate hexo deploy ``` 请注意，部署步骤可能因您选择的部署方式而有所不同。您可以将博客部署到 GitHub Pages、Netlify 或其他托管平台，具体步骤请参考 Hexo 文档或所选托管平台的文档。 希望这些步骤对您有所帮助！如有任何问题，请随时提问。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值