第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題，去搜搜看，總會(huì)有你想問(wèn)的

如何使用CSS中的邊距屬性將一個(gè)部分移動(dòng)到另一個(gè)部分下方

如何使用CSS中的邊距屬性將一個(gè)部分移動(dòng)到另一個(gè)部分下方

慕萊塢森 2022-12-29 13:56:01
我有一個(gè) html 頁(yè)面，主頁(yè)上有很多部分，我有如下兩個(gè)部分：<div class='first section'>  <a href=''>    <button style='background: linear-gradient(to bottom, #cc99ff 0%, #ff99cc 100%);'>          <h3> HMT Rice</h3>          </button>  </a></div><div class='second section'>  <a href=''>    <button style='background: linear-gradient(to bottom, #cc99ff 0%, #ff99cc 100%);'>          <h3> PKS Rice</h3>          </button>  </a></div>我使用 margin-top 屬性將第一部分降低一點(diǎn)，但它只是在上方和上方創(chuàng)建了一個(gè)空白。我只想使用 css 制作第二部分下方的第一部分，如下圖所示：無(wú)論如何，是否可以使用 z-index 或其他方式將第一部分直接放在下面。請(qǐng)幫忙。提前致謝
查看完整描述

1 回答

?
慕虎7371278

TA貢獻(xiàn)1802條經(jīng)驗(yàn) 獲得超4個(gè)贊

您可以嘗試使用以下 HTML 和 CSS。


.section{

    position: relative;

}

.second_section{

    margin-top: 0px;

}

.first_section{

   position: absolute;

   margin-top: 70px; /* Adjust this margin top pixed according to the space you needed. */

}

<div class="section">

    <div class="first_section">

      <a href=''>

        <button style='background: linear-gradient(to bottom, #cc99ff 0%, #ff99cc 100%);'>


          <h3> HMT Rice</h3>

          </button>

      </a>

    </div>


    <div class="second_section">

      <a href=''>

        <button style='background: linear-gradient(to bottom, #cc99ff 0%, #ff99cc 100%);'>


          <h3> PKS Rice</h3>

          </button>

      </a>

    </div>

</div>

我已通過(guò)檢查元素解決了您網(wǎng)站中的問(wèn)題。請(qǐng)遵循以下代碼。


您應(yīng)該使用slide-button-wrapper div包裝按鈕 div 和滑塊 div并添加 css。


<div class="slide-button-wrapper">            

    <div class="mainsme" id="grid">


      <h2 style="font-size:28px;">Shop by Category</h2>

      <div class="gridmine">

         <!---buttons will goes here-->

      </div>


    </div>

                     

    <div class="main-row slider-section" style="order: 1;">

        <banner codes are here>

    </div>

</div>



@media only screen and (max-width: 600px) {

        .slide-button-wrapper {

            display: flex;

            flex-direction: column;

        }

        

        .mainsme{

          order: 2;

        }

        .slider-section{

          order: 1

        }`

    }


查看完整回答
反對(duì) 回復(fù) 2022-12-29
  • 1 回答
  • 0 關(guān)注
  • 142 瀏覽
慕課專(zhuān)欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)