Question

是否有一些有用的技术？

对于文本居中，我尝试使用它：

.wrapper div {
   position: relative;
   top: -8px;
}

要删除底部画布边距，我尝试使用它：

.wrapper canvas {
   margin-bottom: -5px;
}

但我总是尽量避免使用负面参数。

Answer 1

这是你的意思吗？

canvas {
    float: left;
}

Answer 2

你的意思是垂直对齐吗？喜欢这个？

.wrapper {
  border: 1px solid green;
  display: inline-block;
}
.wrapper div {
  border: 1px solid blue;
  display: inline;
  margin-left: 10px;
}
.wrapper canvas {
  border: 1px solid red;
  display: inline-block;
  vertical-align: middle;
}

<div class="wrapper">
  <canvas width="32" height="32"></canvas>
  <div class="question">1234567890</div>
</div>

Answer 3

您可以将此代码用于水平设计

<style> 
.wrapper {
    border: 1px solid green;
    float:left;
}
.demo_class{
    display: inline-block;
    float: left;
} 
.demo_class .question{
    height: 32px;
    line-height: 32px;
}

<div class="wrapper">
<div class="demo_class">
    <canvas id="null" width="32" height="32" style="border:1px solid red;"></canvas>
</div>

<div class="demo_class">
    <div class="question">1234567890</div>
</div>

如何将div和canvas水平对齐到网格

3 个答案: