私はすべてのブラウザとデバイスでこのウェブサイトの1920 x 1080の解像度を維持する必要があります

-1

私はこのウェブサイトを、検索されているすべてのブラウザとデバイスで応答させたいと考えています。それを開くときは、ActiveXコンテンツを許可するようにしてください。このウェブサイトはウイルスに感染していません。私はすべてのブラウザとデバイスでこのウェブサイトの1920 x 1080の解像度を維持する必要があります

@import url("http://fonts.googleapis.com/css?family=Lato"); 
 

 
body { 
 
background: -moz-linear-gradient(307deg, rgba(105,250,255,1) 0%, rgba(92,232,211,1) 20%, rgba(74,207,147,1) 50%, rgba(18,168,153,1) 83%, rgba(0,156,156,1) 94%); /* ff3.6+ */ 
 
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(105,250,255,1)), color-stop(20%, rgba(92,232,211,1)), color-stop(50%, rgba(74,207,147,1)), color-stop(83%, rgba(18,168,153,1)), color-stop(94%, rgba(0,156,156,1))); /* safari4+,chrome */ 
 
background: -webkit-linear-gradient(307deg, rgba(105,250,255,1) 0%, rgba(92,232,211,1) 20%, rgba(74,207,147,1) 50%, rgba(18,168,153,1) 83%, rgba(0,156,156,1) 94%); /* safari5.1+,chrome10+ */ 
 
background: -o-linear-gradient(307deg, rgba(105,250,255,1) 0%, rgba(92,232,211,1) 20%, rgba(74,207,147,1) 50%, rgba(18,168,153,1) 83%, rgba(0,156,156,1) 94%); /* opera 11.10+ */ 
 
background: -ms-linear-gradient(307deg, rgba(105,250,255,1) 0%, rgba(92,232,211,1) 20%, rgba(74,207,147,1) 50%, rgba(18,168,153,1) 83%, rgba(0,156,156,1) 94%); /* ie10+ */ 
 
background: linear-gradient(143deg, rgba(105,250,255,1) 0%, rgba(92,232,211,1) 20%, rgba(74,207,147,1) 50%, rgba(18,168,153,1) 83%, rgba(0,156,156,1) 94%); /* w3c */ 
 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#69FAFF', endColorstr='#009C9C',GradientType=0); /* ie6-9 */ 
 
} 
 

 

 

 
.Chile \t \t {border: none; width:20%; height:30px; position:absolute; top:8px; left:25px; margin:10px; padding:10px; height: 30px;} 
 
#chName \t \t {position:absolute; top:17px; left:34px;} 
 
#chi \t \t {position:absolute; top:15px; left:225px; width:125px; height:77px;} 
 
.chClk \t \t {position:absolute; top:60px; left:50px;} 
 
\t \t \t 
 
.Peru \t \t {border: none; width:20%; height:30px; position:absolute; top:8px; left:355px; margin:10px; padding:10px; height: 30px;} 
 
#peName \t \t {position:absolute; top:17px; left:362px;} 
 
#per \t \t {position:absolute; top:15px; left:555px; width:125px; height:77px;} 
 
.peClk \t \t {position:absolute; top:60px; left:50px;} 
 
\t \t \t 
 
.Argentina {border: none; width:20%; height:30px; position:absolute; top:8px; left:685px; margin:10px; padding:10px; height: 30px;} 
 
#arName \t \t {position:absolute; top:17px; left:695px;} 
 
#arg \t \t {position:absolute; top:15px; left:887px; width:125px; height:77px;} 
 
.arClk \t \t {position:absolute; top:60px; left:50px;} 
 
\t \t \t 
 
.Uruguay \t {border: none; width:20%; height:30px; position:absolute; top:8px; left:1014px; margin:10px; padding:10px; height: 30px;} 
 
#urName \t \t {position:absolute; top:17px; left:1025px;} 
 
#uru \t \t {position:absolute; top:15px; left:1217px; width:125px; height:77px;} 
 
.urClk \t \t {position:absolute; top:60px; left:50px;} 
 

 

 
\t \t \t 
 
.chBox \t  {background-color:#F9FAFA; width:20%; height:90%; border:2px solid #D2D9D9; position:absolute; top:175px; 
 
\t \t \t left:25px; margin:10px; text-align:left; padding:10px;} 
 
\t \t \t \t \t 
 

 
<!-- begin snippet: js hide: false console: true babel: false -->

<!DOCTYPE html> 
 
<html > 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Custom Select Menu</title> 
 
    <link rel="stylesheet" href="css/style.css"> 
 
</head> 
 
<body> 
 
    
 
<!-- \t CHILE \t \t --> 
 

 
<img id="chName" src="https://south-america-dashboard.000webhostapp.com/Country_names/chile.png" width="200px" height="64px"></img> 
 
<div class="Chile"> 
 
<div class="chClk"> 
 
<iframe src="http://free.timeanddate.com/clock/i5p80il2/n232/fn5/tct/pct/ftb/th2" frameborder="0" width="94" height="19" allowTransparency="true"></iframe> 
 
</div> 
 
</div> 
 
<img src="https://south-america-dashboard.000webhostapp.com/Flags/chi.png" id="chi"></img> 
 

 
\t <div class="chBox"> 
 
\t <div class="chAp"> 
 
\t <select id="mounth"> 
 
    <option value="hide">- Aplicación -</option> 
 
    <option value="Option 1">Option 1</option> 
 
    <option value="Option 2">Option 2</option> 
 
    <option value="Option 3">Option 3</option> 
 
    <option value="Option 4">Option 4</option> 
 
\t </select> 
 
\t </div> 
 
\t  
 
\t <div class="chEv"> 
 
\t <select id="year"> 
 
    <option value="hide">- Evento -</option> 
 
    <option value="Event 1">Event 1</option> 
 
    <option value="Event 2">Event 2</option> 
 
    <option value="Event 3">Event 3</option> 
 
    <option value="Event 4">Event 4</option> 
 
    </select> 
 
\t </div> 
 
\t </div> 
 

 
<!-- \t PERÚ \t --> 
 
\t 
 
<img id="peName" src="https://south-america-dashboard.000webhostapp.com/Country_names/peru.png" width="200px" height="64px"></img> 
 
<div class="Peru"> 
 
<div class="peClk"><iframe src="http://free.timeanddate.com/clock/i5p80il2/n131/fn5/tct/pct/ftb/th2" frameborder="0" width="94" height="19" allowTransparency="true"></iframe> 
 
</div> 
 
</div> 
 
<img src="https://south-america-dashboard.000webhostapp.com/Flags/per.png" id="per"></img> 
 

 

 
<!-- \t ARGENTINA \t --> 
 
\t 
 
<img id="arName" src="https://south-america-dashboard.000webhostapp.com/Country_names/argentina.png" width="200px" height="64px"></img> 
 
<div class="Argentina"> 
 
<div class="arClk"><iframe src="http://free.timeanddate.com/clock/i5p80il2/n51/fn5/tct/pct/ftb/th2" frameborder="0" width="94" height="19" allowTransparency="true"></iframe> 
 
</div> 
 
</div> 
 
<img src="https://south-america-dashboard.000webhostapp.com/Flags/arg.png" id="arg"></img> 
 

 

 
<!-- \t URUGUAY \t --> 
 
\t 
 
<img id="urName" src="https://south-america-dashboard.000webhostapp.com/Country_names/uruguay.png" width="200px" height="64px"></img> 
 
<div class="Uruguay"> 
 
<div class="urClk"><iframe src="http://free.timeanddate.com/clock/i5p80il2/n163/fn5/tct/pct/ftb/th2" frameborder="0" width="94" height="19" allowTransparency="true"></iframe> 
 
</div> 
 
</div> 
 
<img src="https://south-america-dashboard.000webhostapp.com/Flags/uru.png" id="uru"></img> 
 

 
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> 
 
    <script src="js/index.js"></script> 
 

 
</body> 
 

 
</html>

</div> 
    </div> 
    <img src="https://south-america-dashboard.000webhostapp.com/Flags/uru.png" id="uru"></img> 

    <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> 
     <script src="js/index.js"></script> 

    </body> 

    </html> 

<!-- end snippet -->

出典

2017-06-16 T100

固定サイズと位置をスケーラブルなものに変更するだけです（パーセント、ビューポート単位など）。 – LGSon

私のためにコードを親切に修正してもらえますか？ – T100

それはあなたが求めるものなら、あなたは間違った場所に来た。 SOはコード作成サービスではなく、自分自身をウェブ開発会社にしてくれることを嬉しく思います。 – LGSon

あなたはviewport meta tagに見たいと思うかもしれません最初のもの。また、CSS media rulesが必要な場合もあります。それ以外では、メインコンテナを微調整して、要素コンテナを適切な大きさにスケールします。

出典

2017-06-16 07:41:21 amberbrew

ありがとうございます。私はビューポートのメタタグについての情報を探し、さらなる問題が発生した場合に戻ってくるでしょう。すてきな一日を！ ☺ – T100

のために私のようなスタイルを編集することをお勧め100％で、すべてが応答します：これは非常に静的なコードである

#uru  {position:absolute; top:15px; left:1217px; width:125px; height:77px;}

を、多分あなたは幅を100％とcointainerを必要とし、より少ない可能性position:absolute.を使用するようにしてください

幸運を祈る！

出典

2017-06-20 09:49:04 Lib3r74

私はすべてのブラウザとデバイスでこのウェブサイトの1920 x 1080の解像度を維持する必要があります

答えて

関連する問題