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

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

isometric shape 圖片

isometric shape 圖片

Helenr 2022-10-08 10:10:08
我面前有一個(gè)看起來(lái)像這樣的設(shè)計(jì),如您所見(jiàn),有一個(gè)藍(lán)色方塊(右半部分將隱藏在屏幕外)與網(wǎng)頁(yè)的三個(gè)不同部分重疊,我不知道如何處理它。我能做的只有兩個(gè)選擇,1) 將紫色方塊的一部分添加到3個(gè)部分的每個(gè)部分中,使其合并在一起,但每個(gè)部分的內(nèi)容靈活,因此排隊(duì)的變化很小。2)添加一個(gè)絕對(duì)定位的 div 并將其放置在我需要的位置,并將正方形作為背景圖像,然后使用 z-indexing?我缺少一個(gè)簡(jiǎn)單的解決方案嗎?
查看完整描述

1 回答

?
白衣染霜花

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

你可以試試這樣的


.parent {

  display: flex;

  flex-direction: column

}

.card {

  disaply: flex;

  background: darkblue;

  height: 200px;

  width: 350px;

}


.card2 {

  disaply: flex;

  background: skyblue;

  height: 200px;

  width: 350px;

}


* {

  margin: 0;

  padding: 10px;

}

.diamond {

  height: 150px;

  width: 150px;

  background-color: purple;

  transform: rotate(45deg);

  z-index: 1000;

  margin-left:274px;

  top: 0;

  background: linear-gradient(to left bottom, #ff66ff 50%, #ffe6ff 50%);

<div class="parent">

<div class="card">

  <h1>Item1</h1>

  <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Vero suscipit quisquam, dolor laboriosam fugiat explicabo ipsam dolores.</p>

<div class="diamond"></div>

</div>


<div class="card2">

<h1>Item1</h1>

  <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Vero suscipit quisquam, dolor laboriosam fugiat explicabo ipsam dolores.</p>  

</div>

</div>

https://codepen.io/tonytomk/pen/ExPNWjz


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

添加回答

舉報(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)