Question

var colours = ["#6363FF", "#6373FF", "#63A3FF", "#63E3FF", "#63FFFB",
"#63FFCB","#63FF9B", "#63FF6B", "#7BFF63", "#BBFF63", "#DBFF63",           
"#FBFF63","#FFD363", "#FFB363", "#FF8363", "#FF7363", "#FF6364"];

var heatmapColour = d3.scaleLinear()
.domain(d3.range((0, 1, 1.0 / (colours.length - 1))))
.range(colours);

var hi_scale = d3.scaleLinear()
.range([0,100])
.domain(hi_extent);

Answer 1

首先，<body></body>应该是所有HTML的容器

第二次使用<h3>

关闭</h3>

第3次添加display: inline-block;到包含img和文本的div将删除额外的空格。（在此处阅读更多内容：https://www.w3schools.com/css/css_inline-block.asp）

第4次添加text-align: center;到父级将使孩子居中（确保您的父容器有宽度）

.inline-block {
  display: inline-block;
}

.centered{
 text-align: center;
}

<body style="background-color:#D3D3D3">
  <div class="container-fluid centered">
    <h1 class="text-center">Nelson Mandela</h1>
    <h3 class="text-center"><em>A man who believed in freedom</em></h3>
    <br>

    <div style="background-color:gray" class="text-center inline-block">
      <img class="img-responsive" style="margin:0px" src="https://b-i.forbesimg.com/mfonobongnsehe/files/2013/12/Mandela.jpg">
      <p style="font-size:15px">"Education is the most powerful weapon which you can use to change the world."</p>
    </div>
  </div>
</body>

我无法剪切div元素的边，使其适合图像和文本

1 个答案: