|
 |
  |
| Autor |
Nachricht |
AndyTrendy
Neuer [User]
Anmeldung: 13.07.08
Beiträge: 4
|
 Verfasst am: 13.07.2008, 17:00 Titel: Verbesserungsvorschläge |
 |
|
Hallo
Ich bin Anfänger auf dem Gebiet CSS und HTML.
Ich habe einen kleine Seite erstellt die meine Projkte später einmal anzeigen soll.
Wie ich schon gesagt habe bin ich Anfänger und wollte mal Fragen welche Verbesserungsvorschläge ihr für mich habt.Welche Grundlegenden fehler ich gemacht habe oder was man einfach besser machen könnte
MFG
Vincent
| Code: |
<html>
<head>
<title></title>
<meta name="author" content="Vince">
<style type="text/css">
#Inhalt
{
width: 600px ;
height: 700px;
background-color: #CFCFCF ;
text-align: center;
margin: auto;
}
#Bild
{
margin: 20 ;
background-color: #CFCFCF ;
}
#Details
{
position: realtive;
bottom: 0px;
background-color: #CFCFCF ;
}
#Daten
{
height: 300;
background-color: #CFCFCF;
}
</style>
</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<!--Alles umschließendes Div-->
<div style="text-align:center">
<!--Div mit eigentl. Inhalt-->
<div id="Inhalt">
<!--Div für das Bild-->
<div id="Bild" name="Bild">
<img src="http://www.aatis.de/Roboter/AS117.jpg" alt="" border="0" align="left" width="250" height="250">
<!--Ende Div fürs Bild-->
</div>
<!--Div für die Daten-->
<div id="Daten" name="Daten">
<table cellspacing="20" border="0" align="center" >
<tr>
<td>Name:</td>
<td>Mythos</td>
</tr>
<tr>
<td>Erbauer: </td>
<td>Andreas</td>
</tr>
<tr>
<td>Homepage: </td>
<td>www.Andreas.de</td>
</tr>
</table >
<!--Ende Div für Daten-->
</div>
<!--Div für die Details-->
<div id="Details" name="Details" >
<!--Tabelle für die Details-->
<table align="center" cellspacing="10">
<tr>
<td valign="top"> <b>Sensoren:</b></td>
<td>SF471 Abstandsensoren , Kompass-Modul ,SF401 Ultraschall SF471 Abstandsensoren , Kompass-Modul ,SF401 Ultraschall</td>
</tr>
<tr>
<td><b>Controler:</b></td>
<td>AVR ,Atmel 8Mhz </td>
</tr>
<tr>
<td><b>Aufgaben u. <br> Fähigkeiten:</b> </td>
<td>Lienien folgen , Orientierung im Raum , Hindernisserkennung</td>
</tr>
<tr>
<td><b>Antriebsart:</b></td>
<td>Kettenantrieb</td>
</tr>
<tr>
<td valign="top"><b>Beschreibung:</b></td>
<td>
Die AVR Mikrocontroller unterstützen mächtige und effiziente Adressierungsarten,
um auf den Programmspeicher (Flash) und den Datenspeicher (SRAM, Register, I/O-Speicher und erweiterten I/O-Speicher) zuzugreifen.
Nachfolgend werden die verschiedenen Arten der Adressierung beschrieben.
In den Abbildungen bedeutet OP das Stück des Operationscodes innerhalb des Befehlswortes.
Aus Gründen der Vereinfachung zeigen nicht alle Bilder den exakten Ort der adressierenden Bits.
</td>
</tr>
<!--Ende Tabelle für Details-->
</table>
<!--Ende Div Details-->
</div>
<!--Ende Div Inhalt-->
</div>
<!--Ende Div Allgemein-->
</div>
</body>
</html> |
|
|
| Nach oben |
|
 |
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 490
|
| Verfasst am: 14.07.2008, 06:23 Titel: |
|
|
Gewöhne dir im CSS-, HTML-Code und bei den Dateibezeichnungen am besten durchgehende Kleinschreibung an. Anders kann es je nach Doctype Probleme machen.
Diese Schreibweise ist mir bisher unbekannt:
| Code: | | <div id="Daten" name="Daten"> |
Was bedeutet name="Daten" ?
Bin es eigentlich so gewohnt:
Hier fehlt nach der 20 die Einheit:
| Code: | #Bild
{
margin: 20 ;
background-color: #CFCFCF ;
}
|
Ebenso bei #Daten.
Außerdem darf vor dem Semikolon kein Leerzeichen stehen. Siehe auch Farbcode. Das kommt bei den anderen Div's z.T. ebenso vor.
Das rot markierte ist unnötig, da es keine Wirkung hat:
| Zitat: | #Details
{
position: realtive;
bottom: 0px;
background-color: #CFCFCF ;
}
|
Das
| Code: | <body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
|
kannst du ebenso alles in die CSS-Angaben packen, so dass nur <body> stehen bleibt.
Dafür
| Code: | <!--Alles umschließendes Div-->
<div style="text-align:center"> |
solltest du einen Div definieren und kannst auf die Style-Angabe im HTML-Teil verzichten. Vermutlich soll dieser Div zentriert sein. Das machst du am besten wie  hier beschrieben.
Die Hintergrundfarbe #cfcfcf kannst du einmal in den allumfassenden Div packen und überall anders entfernen. Dadurch wird #Details überflüssig.
_________________
sejumas CSS-Einsteigerkurs
|
|
| Nach oben |
|
|
hmeise
Neuer [User]
Anmeldung: 18.07.08
Beiträge: 1
Wohnort: Bodensdorf ...
|
| Verfasst am: 18.07.2008, 02:48 Titel: |
|
|
Hallo AndyTrandy!
1.) Ist wahrscheinlich etwas zu spät, aber trotzdem:
2.) Sollte bei Homepage unter der ID Daten ein Link sein setze ein http:// vor.
3.) Setze auch <br>-Tags immer so: <br />.
4.) Ist auch in Ordnung, dass Du das ID- und NAME-Attribut setzt, da damit die Abwärtskompatibilität zu HTML vorhanden bleibt. Für CSS und XHTML brauchst Du jedoch ID.
5.) Außerdem empfehle ich Dir, sollten weitere Seiten auf diese CSS-Formatierungen zugreifen, eine externe CSS-Datei per <LINK>-Tag einzufügen, da dadurch auch die Übersichtlichkeit bestehen bleibt.
6.) Wenn Du auch für das Foto einen Abstand per CSS setzt sieht das sicher besser aus.
7.) Außerdem kannst Du Dir einige Schreibarbeit sparen, wenn Du die Fettschrift per CSS über eine ID einfügst (Hier wurde auch ein Fehler ausgebessert). Und bei der ID Daten würde ich dies auch für Name, Erbauer und Homepage setzen:
VORHER:
<tr>
<td><b>Controler:</b></td>
<td>AVR ,Atmel 8Mhz </td>
</tr>
NACHHER (X)HTML:
<tr>
<td id="table_up">Controller: <br /> </td>
<td>AVR ,Atmel 8Mhz </td>
</tr>
NACHHER CSS:
#table_up {
font-weight: bold;
}
8.) Wenn Du noch für die Größenangaben für die Schrift und die Innen- und Außenabstände em nimmst passt sich das Layout den Angaben an, die im Browser angepasst wurden (im Firefox Ansicht -> Zoom, im IE Ansicht -> Textgröße). Dadurch wird das Layout an der Schriftgröße gemessen aufgeteilt, was in gewissen Situationen einfach besser aussieht.
ZU GUTER LETZT:
Trotzdem fein gemacht, hat nur der Feinschliff gefehlt. Wenn Du willst kann ich Dir gute Literatur zum Nullpreis/Kleinstpreis empfehlen.
|
|
| Nach oben |
|
|
|
|
  |
|
Alle Zeiten sind GMT + 1 Stunde
|
| Seite 1 von 1 |
|  |
