有没有办法在Markdown中创建一个在新窗口中打开的链接?如果不是,您建议使用什么语法来完成此操作?我将把它添加到我使用的markdown编译器中。我认为这应该是一个选择。
当前回答
所以,这不是完全正确的,你不能添加链接属性Markdown URL。要添加属性,请检查正在使用的底层markdown解析器及其扩展。
特别是,pandoc有一个扩展来启用link_attributes,它允许在链接中进行标记。如。
[Hello, world!](http://example.com/){target="_blank"}
对于那些来自R的(例如使用rmarkdown, bookdown, blogdown等等),这是你想要的语法。 对于那些不使用R的用户,你可能需要在调用pandoc时使用+link_attributes来启用扩展
注意:这与kramdown解析器的支持不同,后者是上面接受的答案之一。特别要注意的是,kramdown与pandoc不同,因为它需要一个冒号——:——在花括号的开头——{},例如。
[link](http://example.com){:hreflang="de"}
特别是:
# Pandoc
{ attribute1="value1" attribute2="value2"}
# Kramdown
{: attribute1="value1" attribute2="value2"}
^
^ Colon
其他回答
我正在使用Grav CMS,这是完美的:
阀体/内容: 一些文本[1]
车身/参考: [1]: http://somelink.com/?target=_blank
只要确保目标属性首先被传递,如果链接中有其他属性,将它们复制/粘贴到引用URL的末尾。
也可以作为直接链接: [进入本页](http://somelink.com/?target=_blank)
React + Markdown环境:
我创建了一个可重用组件:
export type TargetBlankLinkProps = {
label?: string;
href?: string;
};
export const TargetBlankLink = ({
label = "",
href = "",
}: TargetBlankLinkProps) => (
<a href={href} target="__blank">
{label}
</a>
);
我在任何需要在新窗口中打开链接的地方都使用它。
不是一个直接的答案,但可能会帮助一些人在这里结束。
如果你正在使用GatsbyJS,有一个插件可以自动在markdown中添加target="_blank"到外部链接。
它被称为gatsby-remark-external-links,用法如下:
Yarn添加gatsby-remark-external-links
plugins: [
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [{
resolve: "gatsby-remark-external-links",
options: {
target: "_blank",
rel: "noopener noreferrer"
}
}]
}
},
它还负责rel="noopener noreferrer"。
如果需要更多选项,请参考文档。
在我的项目中,我这样做,它工作得很好:
[Link](https://example.org/ "title" target="_blank")
Link
但并非所有解析器都允许这样做。
如果您只想在特定的链接中执行此操作,只需使用其他人回答的内联属性列表语法,或者只使用HTML。
如果你想在所有生成的<a>标签中这样做,这取决于你的Markdown编译器,也许你需要一个扩展。
这些天我正在为我的博客做这个,它是由pelican生成的,它使用Python-Markdown。我找到了Python-Markdown Phuker/markdown_link_attr_modifier的扩展,它工作得很好。注意,旧的名为newtab的扩展在Python-Markdown 3.x中似乎不起作用。
推荐文章
- 撇号的HTML代码
- 使用pandoc从Markdown转换为PDF时设置空白大小
- 如何显示数学方程在一般github的markdown(不是github的博客)
- 为什么我的CSS3媒体查询不能在移动设备上工作?
- 下一个元素的CSS选择器语法是什么?
- 我如何用CSS跨浏览器绘制垂直文本?
- 如何获得box-shadow在左侧和右侧
- 相对定位一个元素,而不占用文档流中的空间
- 使用Markdown的Sphinx而不是reST
- 如何在jQuery检索复选框值
- 禁用身体滚动
- 如何在删除前显示确认消息?
- 在一个CSS宽度的小数点后的位置是尊重?
- 我怎么能选择一个特定的类的最后一个元素,而不是父里面的最后一个孩子?
- 反应:为什么当道具改变时子组件不更新