在https://using-remark.gatsbyjs.org/hello-world-kitchen-sink/(请参见源代码https://github.com/gatsbyjs/gatsby/tree/master/examples/using-remark)中,链接没有下划线,而在我的博客https://yiksanchan.com(请参见源代码https://github.com/YikSanChan/yiksanchan.com)中,所有链接都没有下划线。链接带有下划线。
为什么?我如何摆脱下划线?我发现了一个与StackOverflow相关的问题Links have an additional underline in gatsby,但我想理解的是,using-remark示例如何在不覆盖box-shadow
道具的情况下解决了下划线问题。
按照Ferran的解决方案,在我的typography.js中,我进行了更改
Wordpress2016.overrideThemeStyles = () => {
return {
"a.gatsby-resp-image-link": {
boxShadow: `none`,
},
}
}
进入
Wordpress2016.overrideThemeStyles = () => {
return {
"a.gatsby-resp-image-link": {
boxShadow: `none`,
},
"a": {
boxShadow: `none`,
},
}
}
删除下链接。
答案 0 :(得分:1)
您的typography.js
文件正在向所有box-shadow
元素添加<a>
:
a {
box-shadow: 0 1px 0 0 currentColor;
color: #007acc;
text-decoration: none;
}
如果要摆脱这种样式,只需删除box-shadow
属性的规则(如果它不是模块)。如果是打包文件,只需用另一个样式文件(SCSS,CSS或JS)覆盖样式即可。
答案 1 :(得分:-1)
是的,由于某种原因,默认的链接样式是背景图像(不知道)和框阴影(也不知道),请将它们都设置为none,而您应该像下雨一样。