我有以下几点:
如何去掉蓝色下划线? 代码如下:
<Link to="first"><MenuItem style={{paddingLeft: 13, textDecoration: 'none'}}> Team 1 </MenuItem></Link>
MenuItem组件来自http://www.material-ui.com/#/components/menu
我有以下几点:
如何去掉蓝色下划线? 代码如下:
<Link to="first"><MenuItem style={{paddingLeft: 13, textDecoration: 'none'}}> Team 1 </MenuItem></Link>
MenuItem组件来自http://www.material-ui.com/#/components/menu
当前回答
对我有用的是:
<Link to="/" style={{boxShadow: "none"}}>
其他回答
CSS解决方案也用于React
只在Link(React Router)标签中添加className/class。(最重要的部分!!在链接标签中添加ClassName,而不是其他标签。) 在css文件中添加text-decoration: none。
Nav.js
<Link to="/" className="link" >
Get Started
</Link>
Nav.css
.link{
text-decoration: none;
}
还有另一种方法可以正确地删除链接的样式。你必须给它的textDecoration='inherit'和color='inherit'的风格,你可以添加这些作为样式的链接标签,如:
<Link style={{ color: 'inherit', textDecoration: 'inherit'}}>
或者为了使它更通用,只需创建一个CSS类:
.text-link {
color: inherit;
text-decoration: inherit;
}
然后只需<Link className='text-link'>
你可以在Link组件中添加style={{textDecoration: 'none'}}来删除下划线。你也可以在样式块中添加更多的css,例如style={{textDecoration: 'none', color: 'white'}}。
<h1>
<Link style={{ textDecoration: 'none', color: 'white' }} to="/getting-started">
Get Started
</Link>
</h1>
jsx:
<Link className="link">
test
</Link>
css:
.link{
text-decoration: none;
}
你可以在你的scss文件中使用这段代码; 这将消除不需要的颜色变化,
a:-webkit-any-link {
&:hover {
color: white;
}
}