我該如何轉動我的三角形響應？

-1

我試圖讓我的三角形響應，因爲它只適用於臺式電腦，我該怎麼做？我該如何轉動我的三角形響應？

我有一個代碼在這裏，我想談談我的DIV成響應格，移動電話，平板電腦......

三角代碼：

*{ 
background-color: black; 
    padding:0; 
    margin:0 auto; 
} 


.triangle-down { 
width: 0px; 
height: 0px; 
border-style: solid; 
border-width: 642px 187.5px 0 187.5px; 
border-color: #007bff transparent transparent transparent; 
}

HTML代碼

<div class="triangle-down"></div>

來源

2014-02-20 user2744048

如果您希望邊框比例適當，測量將需要在個百分點。不幸的是，border-width不能和百分比一起工作。您可以使用媒體查詢和斷點或線性漸變。看到這個鏈接：http://stackoverflow.com/questions/12380759/css-border-width-percentage – Coop

作爲身體背景的替代方案： http://codepen.io/gc-nomade/pen/mBjtC

body { 
    background: 
    linear-gradient(
     to top left, 
     black, 
     black 50%, 
     rgba(0,0,0,0) 50%, 
    rgba(0,0,0,0)) top center no-repeat, 
    linear-gradient(
     to top right, 
     black, 
     black 50%, 
     #007bff 50%, 
     #007bff ) top center no-repeat; 
    background-size:40% 200%;/* set your own values and units here */ 
    background-color: black; 
    padding:0; 
    margin:0 auto; 
    min-height:100%; 
} 
html { 
    height:100%; 
}

來源

2014-02-20 19:49:47

您應該使用百分比而不是像素，您可以通過將像素大小除以上下文來計算等效值，上下文通常是您尚未聲明的正文容器的大小但通常爲1000px，以方便使用。如果你不介意使用background-radient，可以使用ems，除以基本的piel大小，或者你可以使用轉換器，如果你還沒有聲明基本字體大小通常是16px http://pxtoem.com/

來源

2014-02-20 19:42:52 Lauren

我該如何轉動我的三角形響應？

回答

相關問題