如何将内容添加到div

时间:2019-06-25 15:52:45

标签: javascript html css bootstrap-4

我必须设置一个菜单网站进行分配,并且想为订单摘要添加一个浮动面div

Figma参考:https://images2.imgbox.com/59/9f/qikiR5qq_o.jpg

注意:这是任何编码的第一堂课,所以我对此很陌生。

我已经设置了div和grid,但是如果不弄乱内容就不能添加内容。

底部的按钮始终不在底部或底部过高而无法通过div。问题是div还是内容?

是否有一种使用“删除”按钮删除项目的方法?我猜那是JavaScript吗?

我在这里复制了代码:https://jsfiddle.net/93bqypdu/1/

<div class="grid-container">
<div class="a">a</div><div class="a">a</div><div class="a">a</div>
<div class="a">a</div><div class="a">a</div><div class="a">a</div>
<div class="a">a</div><div class="a">a</div><div class="a">a</div>
<div class="a">a</div><div class="a">a</div><div class="a">a</div>
</div>

<div class="side">
<img src="https://images2.imgbox.com/f6/96/uf0fayVE_o.png" width="150vh" 
height="auto" class="pic">
<div class="content">Lorem Ipsum</div>

<div class="sbutt">
CANCEL
</div>

<div class="sbutt">
ORDER
</div>
</div>

1 个答案:

答案 0 :(得分:0)

如果您指的是小提琴中未对齐的“订购和取消”按钮,我们将需要为按钮添加一个额外的div容器,并为该按钮分配其他类别:

HTML

Async(
    {
        workload()
    },
    { response ->
      Log.d("foo", "The response is: $response")
    }
).execute( "" )

CSS

<div class="grid-container">
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
  <div class="a">a</div>
</div>

<div class="side">
  <img src="https://images2.imgbox.com/f6/96/uf0fayVE_o.png" width_="150vh" height="auto" class="pic">
  <div class="content">Lorem Ipsum</div>

  <div class="sbutt-container">
    <div class="sbutt cancel" onclick="window.location.href = 'Hiveworks.html';">
      CANCEL
    </div>

    <div class="sbutt order" onclick="window.open('dashboard.html', '_blank', 'toolbar=no,scrollbars=no,resizable=no,top=100,left=800,width=380,height=380',overflow=hidden)">
      ORDER
    </div>
  </div>
</div>

观看实际情况:https://jsfiddle.net/q4n9rxhg/