• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Browser Anzeige & 2 Links verschieden machen

kaepten

Mitglied
Guten Tag,
ich habe gleich zwei Fragen an euch.
Die erste Frage: Ich schreibe meine Codes mit PsPad. Der interne Browser von PsPad schau so aus wie auf dem Bild.
pspad.PNG
Aber sobald ich es in Firefox öffne sieh es gleich ganz anders aus.
Woran liegt das? Und wie mache ich das richtig?

(die Codes findet ihr am Ende )
browser.PNG

Nun zu meiner zweiten Fragen wie ihr vielleicht auf dem ersten Bild erkennen könnt,befindet sich unter dem Bild BKWI Links,aber gleichzeitig befindet sich in der Tabelle auch Links,aber wie kann ich jetzt die Links lassen aber nur unterschiedlich formatieren?
HTML-Code für Schulplan:
Code:
<!DOCTYPE html>
<html>

  <head>
   <link  rel="stylesheet" type="text/css" href="formatschulplan.css"  />
   <meta chraset="UTF-8">
   <title> BKWI - Schulplan </title>
   <link href="bilder/favicon.ico" rel="shortcut icon">
  </head>

<body>

<div class="titel">
<img src="bilder/bkwi.png" alt="BKWI" width="200" height="90" />

</div>


<div class="navioben">


<a href="index.html"><img src="bilder/930.png" alt="BKWI" width="43" height="43"/></a>
<a href="schulplan.html">Schulplan</a>
<a href="anmeldeformular.html">Anmeldeformular</a>
<a href="kontakt.html">Kontakt</a>



</div>


<div class="navilinks">

<a href="#haupt"><h3>Hautpfächer</h3></a>
<a href="#neben"><h3>Nebenfächer</h3></a>
<a href="#pru"><h3>Prüfungen</h3></a>
</div>

<div class="inhalt">



<h1> Anmeldeformular </h1>


<table>

<colgroup>
<col class="spalte1" />
<col class="spalte1" />
<col class="spalte1" />
<col class="spalte1" />
<col class="spalte1" />
<col class="spalte1" />
</colgroup>

<tr>
<th> Zeit </th>
<th> Montag </th>
<th> Dienstag </th>
<th> Mittwoch </th>
<th> Donnerstag </th>
<th> Freitag </th>
</tr>

<tr>
<td> 7:45-8:30 </td>
<td rowspan="2"> - </td>
<td class="farbe5" rowspan="3"><a  href="#haupt">BWL</a></td>
<td class="farbe5" rowspan="2"> BWL/IKT </td>
<td class="farbe3" rowspan="2"> WI </td>
<td class="farbe8" rowspan="2"> GW </td>
</tr>

<tr>
<td> 8:30-9:15 </td>
</tr>

<tr>
<td> 9:35-10:20 </td>
<td class="farbe3" rowspan="2"> WI </td>
<td class="farbe7" rowspan="2"> GGK </td>
<td class="farbe5" rowspan="2"> BWL </td>
<td class="farbe9" rowspan="2"> BM </td>
</tr>

<tr>
<td> 10:20-11:05 </td>
<td class="farbe6"> Religon  </td>
</tr>

<tr>
<td> 11:20-12:05 </td>
<td class="farbe1" rowspan="2"> Mathe </td>
<td class="farbe2" rowspan="2"> Deutsch </td>
<td class="farbe5" rowspan="2"> BWL </td>
<td class="farbe4" rowspan="2"> Englisch </td>
<td class="farbe3" rowspan="2"> WI </td>
</tr>

<tr>
<td> 12:15-13:00 </td>
</tr>

<tr>
<td> 13:00-13:45 </td>
<td colspan="5"> M I T T A G S P A U S E </td>
</tr>

<tr>
<td> 13:50-14:35 </td>
<td class="farbe2", rowspan="2"> Deutsch </td>
<td>  </td>
<td>  </td>
<td>  </td>
<td class="farbe4", rowspan="2"> Englisch </td>
</tr>

<tr>
<td> 14:45-15:20 </td>
</tr>




</table>


<h3>Prüfung</h3>
Abschlussprüfung Fachhochschulreife in den schriftlichen Prüfungsfächern:
<p> Deutsch,Englisch, Betriebswirtschaftslehre,Mathematik und einem mündlichen Prüfungsfach. </p>


<h3> Hautpfächer </h3>
<a id="haupt" </a>
<h3>Nebenfächer</h3>
<a id="neben" </a>

<h3>Prüfung</h3>
<a id="pru" </a>

</div>

<div class="navirechts">
Kontakt

So erreichen Sie uns:


</div>
</body>

</html>

CSS-Code für Schulplan:

Code:
body
    {
     font-size: 12pt;
     color: black;
     background-color: #FFFFFF;
     font-family: verdana;
     /* cursor:  url(bilder/cat.ani), progress; */
    }
h1
    {
     font-size: 16pt;
    }
  
h2
    {
     font-size: 14pt;
    }
h3
    {
     font-size: 14pt;
     color: #0066FF;
    }
h4
    {
     font-size: 13pt;
    }

h5  {
     background-color: darkred;
     color: FFFFFF;
     padding: 8px;
    }


  
a:link
    {
     text-decoration: none;
     color: #C0C0C0;
     text-underline: none;
      font-size: 18pt;
    }
  
a:active
    {
     text-decoration: none;
     text-underline: none;
     color: #C0C0C0;
    }
   

a:visited
    {
     text-decoration: none;
     text-underline: none;
     color: #C0C0C0;
    }
  
a:hover
    {
      cursor:  url(bilder/finger.cur), progress;
      background-color: 000000;
    }
/*       Nicht mehr wichtig da a:hover
.mauszeiger
          body, a:hover {cursor: url(bilder/mittelfinger.cur), progress;} */

ul
    {
     list-style-type: circle;
    }
  
.mitte
    {
     text-align:center;
    }
.rechts
    {
     text-align:right;
    }
  
table
    {
      width: 85%;
      border-width: 3pt;
      border-style: solid;
      border-color: #000000;
      background-color: #C0C0C0;
    }
  
th
    {
      background-color: #99FFFF;
    }

td
    {
      border-width: 1pt;
      border-style: solid;
      border-color: #000000;
    }

.spalte1
    {
      background-color: #C0C0C0;
      width: 15%;
    }
  
.farbe1
    {
      background-color: #99CCFF;
    }
  
.farbe2
    {
      background-color: #FFFF00;
    }
  
.farbe3
    {
      background-color: #FFFFFF;
    }
  
.farbe4
    {
      background-color: #FF0000;
    }
  
.farbe5
    {
      background-color: #00CC00;
    }
  
.farbe6
    {
      background-color: #FF00FF;
    }
  
.farbe7
    {
      background-color: #FFCCFF;
    }
  
.farbe8
    {
      background-color: #800080;
    }
  
.farbe9
    {
      background-color: #FFCC00;
    }


.titel
       {
          width: 1300px;
          height: 100px;
          background-color: #FFFFFF;
        
       }

       }
.navioben
       {
          width: 1300px;
          height: 45px;
          background-color: #494949;
          color: #D2D2D2;
          padding-bottom: 15px;
          padding-top: 15px;
       }
     
.navilinks
       {
          width: 150px;
          height: 1000px;
          background-color: #D6D6D6;
          color: #000000;
          float: left;
     
       }
     
.inhalt
       {
          text-algin: left;
          width: 950px;
          height: 1000px;
          background-color: #FFFFFF;
          overflow: auto;
          float: left;
          margin: 5px;
       }

.navirechts
       {
          width: 200px;
          height: 1000px;
          background-color: #FFFFFF;
          color: #000000;
     }
 
Keine Ahnung was du meinst, weil sehr unverständlich. Ich kann nur die leeren Tabellenzellen erkennen. Wenn du diese ausblenden möchtest, kannst du es mit
table {
....
empty-cells:hi
de;
}

erreichen.

Ach und unterm .title-Selektorblock ist eine geschlossene Klammer zu viel.
Code:
.titel
       {
          width: 1300px;
          height: 100px;
          background-color: #FFFFFF;
      
       }

       }
 
Zuletzt bearbeitet:
Und der Unterschied der Darstellung rührt daher, dass dein Programm eine Browser-Engine verwendet, die den Quellcode offenbar anders rendert als der Firefox. Für eine zuverlässige Ansicht solltest Du dich immer auf die Browser-Ansicht verlassen, nicht auf Vorschau-Funktionen von Editoren, solange Du nicht weißt was dahinter steckt.
 
wie kann ich jetzt die Links lassen aber nur unterschiedlich formatieren?

Indem du dem Link eine class gibst.
Zum Beispiel:

HTML:
<a class="anders" href="http://example.com/">Beispiellink</a>

HTML:
a.anders:link
{
color:#ff0000;
text-decoration:none;
}

Ich kann ja verstehen das du Anfänger bist, aber solche Fragen lassen sich innerhalb von 1 Minute mit Google beantworten.

Gruss
Elroy
 
Zurück
Oben