Wie kann ich meine Website ansprechen?

-4

Ich arbeite an einer Website für ein Schulprojekt, das heute fällig ist, und ich habe versucht, was alles scheint, um es richtig zu reagieren und egal, was es nicht korrekt skaliert. Ich bin nicht so kenntnisreich mit Codierung für Anfang und besorgt, da dies bald fällig ist. Kann mir jemand helfen oder mich in die richtige Richtung lenken, um das für mobile Geräte und so weiter zu bringen? Danke im Voraus.Wie kann ich meine Website ansprechen?

Im Folgenden ist die CSS

body { 
    font-family: arial; 
    font-size: 12px; 
    cursor: default; 
    color: #AAAAAA; 
} 
td { 
    font-family: arial; 
    font-size: 12px; 
    cursor: default; 
    color: #242121 
} 
a { 
    color: #000000; 
    text-decoration: none; 
    font-size: 16px 
} 
a:hover { 
    color: #000000; 
    text-decoration: underline 
} 
input { 
    border-width: 1; 
    font-family: arial; 
    font-size: 12px; 
    padding: 2px; 
    height: 21px; 
    border-color: #000000; 
    border-style: solid; 
    background-color: #ffffff; 
    color: #000000 
} 
.slogan { 
    font-size: 14px; 
    color: #ffffff; 
    padding: 0 0 0 10; 
} 
.class1 { 
    font-size: 18px; 
    color: #ffffff; 
    font-family: Times; 
}

Hier finden Sie eines der Internetseite: index.html

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Litter of Love</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"/> 
     <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="style-2.css" /> 
     <script> 
      Alert("Welcome to my web page!") ; 
     </script> 
    </head> 
    <body bgcolor="FFFFFF"> 
     <div align="center"> 
      <table width="750" border="0" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td colspan="3" width="750" height="200" background="header.jpg" valign="top" style="padding:0 0 0 10"> 
         <table width="700" border="0" cellpadding="0" cellspacing="0"> 
          <tr> 
           <td width="330" class="slogan"> 
            Build a Stylish Cat-Friendly Home 
           </td> 
           <td width="400" align="right"> 
            <table width="400" border="0" cellpadding="0" cellspacing="0"> 
             <tr> 
              <td align="right" height="20"> 
              </td> 
             </tr> 
            </table> 
           </td> 
           <td width="20"></td> 
          </tr> 
         </table> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="3" height="15" bgcolor="FFFFFF"></td> 
       </tr> 
       <tr> 
        <td colspan="3" height="1" bgcolor="CCCCCC"></td> 
       </tr> 
       <tr> 
        <td colspan="3" height="10" bgcolor="FFFFFF"></td> 
       </tr> 
       <tr> 
        <td width="170" bgcolor="FFFFFF" valign="top"> 
         <span style="font-size:6px"><br></span> 
         <div align="center"> 
          <table width="140" border="0" cellpadding="0" cellspacing="0"> 
           <tr> 
            <td><a href="index.html">Home</a></td> 
           </tr> 
           <tr> 
            <td height="5" bgcolor="#FFFFFF"></td> 
           </tr> 
           <tr> 
            <td><a href="contact.html">Contact us</a></td> 
           </tr> 
           <tr> 
            <td height="5" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td><a href="about.html">About us</a></td> 
           </tr> 
           <tr> 
            <td height="5" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td><a href="shop.html">Products</a></td> 
           </tr> 
           <tr> 
            <td height="5" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td><a href="media.html">Media</a></td> 
           </tr> 
          </table> 
          <br><span style="font-size:6px"><br></span> 
          <span style="font-size:6px"><br></span> 
         </div> 
        </td> 
        <td width="1" bgcolor="CCCCCC"></td> 
        <td width="579" valign="top"> 
         <span style="font-size:6px"><br></span> 
         <div align="center"> 
          <table width="549" border="0" cellpadding="0" cellspacing="0"> 
           <tr> 
            <td colspan="4" height="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="1" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td rowspan="2" colspan="2" width="542" height="27" bgcolor="#334a10" class="class1">&nbsp;&nbsp;HEALTHY</td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="4" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0" height="23"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" bgcolor="FFFFFF"> 
             <table width="542" border="0" cellpadding="17" cellspacing="0"> 
              <tr> 
               <td style="color:999999;line-height:1.6em"> 
                <div align="justify"> 
                 <img src="healthy.jpg" width="350" height="200" align="left"> 
                 Put together an engaging jungle gym for your cat friend and provide the gift of satisfaction and longevity. 
                 <br><br> 
                 Made by eco friendly materials and production recycled packaging. 
                </div> 
               </td> 
              </tr> 
             </table> 
            </td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" height="5" bgcolor="FFFFFF"></td> 
            <td width="4" height="5" bgcolor="FFFFFF"></td> 
            <td width="538" height="5" bgcolor="F0F0F0"></td> 
            <td width="1" height="5" bgcolor="F0F0F0"></td> 
            <td width="5" height="5" bgcolor="F0F0F0"></td> 
           </tr> 
          </table> 
          <br> 
          <table width="549" border="0" cellpadding="0" cellspacing="0"> 
           <tr> 
            <td colspan="4" height="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="1" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td rowspan="2" colspan="2" width="542" height="27" bgcolor="#334a10" class="class1">&nbsp;&nbsp;FUNCTIONAL 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="4" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0" height="23"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" bgcolor="FFFFFF"> 
             <table width="542" border="0" cellpadding="17" cellspacing="0"> 
              <tr> 
               <td style="color:999999;line-height:1.6em"> 
                <div align="justify"> 
                 <img src="functional.jpg" width="350" height="200" align="right"> 
                 Captivating, durable and easy to relocate. Our cat furniture designs are a space conscious alternative to the traditional commercial cat tree. 
                </div> 
               </td> 
              </tr> 
             </table> 
            </td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" height="5" bgcolor="FFFFFF"></td> 
            <td width="4" height="5" bgcolor="FFFFFF"></td> 
            <td width="538" height="5" bgcolor="F0F0F0"></td> 
            <td width="1" height="5" bgcolor="F0F0F0"></td> 
            <td width="5" height="5" bgcolor="F0F0F0"></td> 
           </tr> 
          </table> 
          <br> 
          <table width="549" border="0" cellpadding="0" cellspacing="0"> 
           <tr> 
            <td colspan="4" height="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="1" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td rowspan="2" colspan="2" width="542" height="27" bgcolor="#334a10" class="class1">&nbsp;&nbsp;MODERN</td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" height="4" bgcolor="FFFFFF"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0" height="23"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" bgcolor="FFFFFF"> 
             <table width="542" border="0" cellpadding="17" cellspacing="0"> 
              <tr> 
               <td style="color:999999;line-height:1.6em"> 
                <div align="justify"> 
                 <img src="beautiful.jpg" width="350" height="200" align="left"> 
                 We believe furniture should be noticed, but not draw too much attention. We design conceps which spark conversation in any home, and yet stand the test of time. We are thrilled to see cats coming out of the unnoticed rooms and into your modern living room. 
                </div> 
               </td> 
              </tr> 
             </table> 
            </td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td colspan="2" height="1" bgcolor="AAAAAA"></td> 
            <td width="1" bgcolor="AAAAAA"></td> 
            <td width="5" bgcolor="F0F0F0"></td> 
           </tr> 
           <tr> 
            <td width="1" height="5" bgcolor="FFFFFF"></td> 
            <td width="4" height="5" bgcolor="FFFFFF"></td> 
            <td width="538" height="5" bgcolor="F0F0F0"></td> 
            <td width="1" height="5" bgcolor="F0F0F0"></td> 
            <td width="5" height="5" bgcolor="F0F0F0"></td> 
           </tr> 
          </table> 
          <span style="font-size:6px"><br></span> 
         </div> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="3" height="10" bgcolor="FFFFFF"></td> 
       </tr> 
       <tr> 
        <td colspan="3" height="1" bgcolor="CCCCCC"></td> 
       </tr> 
       <tr> 
        <td colspan="3" height="5" bgcolor="FFFFFF"></td> 
       </tr> 
       <tr> 
        <td colspan="3" bgcolor="FFFFFF" align="right"> 
         Valco Copyright © 2017 All Rights Reserved 
        </td> 
       </tr> 
      </table> 
     </div> 
    </body> 
</html>

Quelle

2017-12-17 Val7x

Blick in '@ media' querys –

https://www.w3schools.com/ css/css_rwd_mediaqueries.asp Verweise –

Nur zur Klarstellung, fragen Sie sich, warum Sie eine horizontale Bildlaufleiste auf einem schmaleren Bildschirm als 766 Pixel erhalten? –

Die schnellsten einen reaktions CSS-Framework verwenden würde, und vorhandene Komponenten nutzen und konfigurieren/stylen Sie sie bei Bedarf entsprechend Ihren Anforderungen.

Ich würde Bootstrap empfehlen, können Sie einige Seite Beispiel here sehen.

Für die Seiten Navigation, Sie Navs > Pills (stacked), die jeweils rechten Abschnitt Panels > Panel with heading könnte mit und innerhalb jeder Platte könnten Sie haben Dies wäre viel schöner als die Verwendung von <table> Layout, wie Sie scheinen zu tun, gerade jetzt Media Object

verwenden könnte .

Viel Glück!

Quelle

2017-12-17 17:45:44 meldev

Wenn Sie nur eine "schnelle" Möglichkeit wünschen, Ihre Website ansprechend zu gestalten. Sie sollten Medienabfragen untersuchen.

Sie sind super intelligent und Sie verwenden sie direkt in Ihrem CSS.

Machen Sie ein für Desktop, Tablet und Handy, und Sie sollten hier :)

gut gehen See: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Quelle

2018-01-10 14:50:01

Wie kann ich meine Website ansprechen?

Antwort

Verwandte Themen