为了账号安全,请及时绑定邮箱和手机立即绑定

为什么锚标签占用额外的空白空间?

为什么锚标签占用额外的空白空间?

互换的青春 2022-01-07 14:19:00
我正在研究反应项目,因为我有一个锚标签,然后我有一个导航栏。问题是锚标签将导航栏推到右侧。因为锚标签占用了额外的空白。我什至尝试过使用display: 'inline-block',但它不起作用。Navbar.jsimport React, { Component } from 'react';import './Navbar.css';import { Link } from 'react-router-dom';class Navbar extends Component {    render() {        return (            <div className='container-fluid custom'>                <div className='container'>                    <div className='row'>                        <div className='col-12'>                            <nav className="navbar navbar-expand-lg navbar-light bg-light">                                <a className="navbar-brand space" href="www.facebook.com">                                    <div className='logo'>                                        <img src='assets/images/kaboom.png' alt='logo'></img>                                    </div>                                </a>                                <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">                                    <span className="navbar-toggler-icon"></span>                                </button>                                <div className="collapse navbar-collapse" id="navbarNav">                                    <ul className="navbar-nav">                                        <li className="nav-item active">                                            <Link className='nav-link' to='/'>Home</Link>                                        </li>                                        </li>                                    </ul>                                </div>                            </nav>                        </div>                    </div>                </div>            </div>        )    }}
查看完整描述

2 回答

?
茅侃侃

TA贡献1842条经验 获得超21个赞

如果您可以向我们提供一个片段或其他内容会更好,但无论如何您可以使用任何浏览器的开发人员工具找出导致空白的原因,它可能是边距或填充,只需打开它并指向您的元素以找出然后您可以通过应用margin:0padding:0应用于该元素来解决问题 ,希望我能提供帮助!


查看完整回答
反对 回复 2022-01-07
?
一只名叫tom的猫

TA贡献1906条经验 获得超3个赞

不要在锚标签内使用 div 。只需将徽标包装在锚标签中,并为该 img 标签指定任何宽度。像这样:


<a className="navbar-brand space"  href="www.facebook.com">

    <img src='assets/images/kaboom.png' width="150" alt='logo'></img>

</a>


查看完整回答
反对 回复 2022-01-07
  • 2 回答
  • 0 关注
  • 133 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信