吾爱破解 - 52pojie.cn

 找回密码
 注册[Register]

QQ登录

只需一步,快速开始

查看: 1628|回复: 7
收起左侧

[已解决] Bootstrap为什么会无中生空格

[复制链接]
Samding 发表于 2019-11-29 20:50
本帖最后由 Samding 于 2019-11-30 00:36 编辑

想问一下图中框柱的空白是怎么来的,能去掉吗
2.png
[HTML] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<head>
  <title>Bootstrap 实例</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" >
  <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
    <div class="container-fluid">
                <pre style="display: inline-block;">       </pre>
                <div style="display: inline-block;" class="row">
                        <div style="display: inline-block;">
                                <p>图片在头部 (card-img-top):</p>
                                <div style="width:400px">
                                        <img class="card-img-top" src="https://static.runoob.com/images/mix/img_avatar.png" style="width:100%">
                                        <div>
                                                <h4>John Doe</h4>
                                                <p>Some example text some example text. John Doe is an architect and engineer
                                                </p> <a href="#" class="btn btn-primary">See Profile</a>
                                        </div>
                                </div>
                        </div>
                        <pre style="display: inline-block;">       </pre>
                        <div style="display: inline-block;">
                                <p>图片在底部(card-img-bottom):</p>
                                <div style="width:400px">
                                        <div>
                                                <h4>Jane Doe</h4>
                                                <p>Some example text some example text. Jane Doe is an architect and
                                                        engineer</p>
                                                <a href="#" class="btn btn-primary">See Profile</a>
                                        </div>
                                        <img class="card-img-bottom" src="https://static.runoob.com/images/mix/img_avatar.png" style="width:100%">
                        </div>
                </div>
        </div>
</body>
 
</html>

发帖前要善用论坛搜索功能,那里可能会有你要找的答案或者已经有人发布过相同内容了,请勿重复发帖。

mustard666 发表于 2019-11-29 21:03
浏览器版本:
Google Chrome 已是最新版本
版本 78.0.3904.108(正式版本) (64 位)

效果如图,没有发现有什么不对
微信截图_20191129210147.png
mustard666 发表于 2019-11-29 21:03
不行你就用开发者工具看看那个空白是什么元素导致的
 楼主| Samding 发表于 2019-11-29 21:26
mustard666 发表于 2019-11-29 21:03
不行你就用开发者工具看看那个空白是什么元素导致的


只有鼠标移到框柱的那行或padding中才会覆盖到那个空白,其它代码,包括那个div内的元素都没有覆盖到空白
4.png
Roothu 发表于 2019-11-29 21:38
本帖最后由 Roothu 于 2019-11-30 18:49 编辑

Cent Browser
版本 4.0.9.112(正式版本) (64 位) (portable) (Chromium 74.0.3729.169)
未出现空白
bakaest 发表于 2019-11-29 22:00
怪,看着好像没问题
ids 发表于 2019-11-29 22:21
Roothu 发表于 2019-11-29 21:38
Cent Browser
版本 4.0.9.112(正式版本) (62 位) (portable) (Chromium 74.0.3729.169)
未出现空白

62位的系统吗?呵呵呵
Roothu 发表于 2019-11-30 18:48
ids 发表于 2019-11-29 22:21
62位的系统吗?呵呵呵

打错字而已 呵呵呵呵
您需要登录后才可以回帖 登录 | 注册[Register]

本版积分规则

返回列表

RSS订阅|小黑屋|处罚记录|联系我们|吾爱破解 - LCG - LSG ( 京ICP备16042023号 | 京公网安备 11010502030087号 )

GMT+8, 2024-11-26 22:20

Powered by Discuz!

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表