響應式網頁,讓div的高和寬保持等比例放大 縮小

2022-06-11 07:09:08 字數 379 閱讀 9537

1,方案一:響應式來做,可以根據**查詢,設定在不同螢幕寬度下div的高度和寬度,具體的設定看你響應式想怎麼顯示

@media only screen and (min-width: 100px) and (max-width: 640px)

}@media only screen and (min-width: 641px) and (max-width: 789px)

}2.方案二:百分比來做,這裡需要運用乙個小技巧,padding用百分比做單位時是相對於容器的寬度來算的,所以你可以把高度設為0,內容自然溢位,設定個padding-bottom

height:0;

width:50%;

padding-bottom:30%

響應式網頁讓乙個div的高和寬保持比例放大縮小

1,方案一 響應式來做,可以根據 查詢,設定在不同螢幕寬度下div的高度和寬度,具體的設定看你響應式想怎麼顯示 media only screen and min width 100px and max width 640px media only screen and min width 641p...

響應式網頁,div的高和寬保持比例放大 縮小

1,方案一 響應式來做,可以根據 查詢,設定在不同螢幕寬度下div的高度和寬度,具體的設定看你響應式想怎麼顯示 media only screen and min width 100px and max width 640px media only screen and min width 641p...

關於網頁的寬 高

兩者分別返回元素節點可見部分的高度和寬度。此 可見部分 包括padding 但不包括border margin和滾動條。let rootelement document.documentelement 網頁當前可見高 寬 rootelement.clientheight rootelement.cl...