16.06.2009, 22:57
|
|||
|
|||
HTML und CSS trennen
Hallo,
ich weis ich bin neu hier aber ich hoffe ihr könnt mir helfen  Also ich habe mir von Adobe Imageready meine hp als css ausgeben lassen. Dabei bekommt man eine html datei in die das css integriert ist. Ich wollte nun das ganze trennen, schaffe es aber nicht so richtig, hier der Quellcode: Code:
<html>
<head>
<title>Homepage1_ohne</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Styles (Homepage1_ohne.psd) -->
<style type="text/css">
<!--
#Table_01 {
position:absolute;
margin:0 auto;
left:0px;
top:0px;
width:1024px;
height:768px;
}
#Homepage1-ohne-01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:204px;
}
#Homepage1-ohne-02 {
position:absolute;
left:0px;
top:204px;
width:99px;
height:564px;
}
#Homepage1-ohne-03 {
position:absolute;
left:99px;
top:204px;
width:545px;
height:45px;
}
#Homepage1-ohne-04 {
position:absolute;
left:644px;
top:204px;
width:380px;
height:44px;
}
#Homepage1-ohne-05 {
position:absolute;
left:644px;
top:248px;
width:75px;
height:520px;
}
#Homepage1-ohne-06 {
position:absolute;
left:719px;
top:248px;
width:288px;
height:231px;
}
#Homepage1-ohne-07 {
position:absolute;
left:1007px;
top:248px;
width:17px;
height:520px;
}
#Homepage1-ohne-08 {
position:absolute;
left:99px;
top:249px;
width:545px;
height:438px;
}
#Homepage1-ohne-09 {
position:absolute;
left:719px;
top:479px;
width:288px;
height:10px;
}
#Homepage1-ohne-10 {
position:absolute;
left:719px;
top:489px;
width:288px;
height:197px;
}
#Homepage1-ohne-11 {
position:absolute;
left:719px;
top:686px;
width:288px;
height:82px;
}
#Homepage1-ohne-12 {
position:absolute;
left:99px;
top:687px;
width:545px;
height:81px;
}
-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (Homepage1_ohne.psd) -->
<div id="Table_01">
<div id="Homepage1-ohne-01">
<img src="images/Homepage1_ohne_01.gif" width="1024" height="204" alt=""> </div>
<div id="Homepage1-ohne-02">
<img src="images/Homepage1_ohne_02.gif" width="99" height="564" alt=""> </div>
<div id="Homepage1-ohne-03">
<img src="images/Homepage1_ohne_03.gif" width="545" height="45" alt=""> </div>
<div id="Homepage1-ohne-04">
<img src="images/Homepage1_ohne_04.gif" width="380" height="44" alt=""> </div>
<div id="Homepage1-ohne-05">
<img src="images/Homepage1_ohne_05.gif" width="75" height="520" alt=""> </div>
<div id="Homepage1-ohne-06">
<img src="images/Homepage1_ohne_06.gif" width="288" height="231" alt=""> </div>
<div id="Homepage1-ohne-07">
<img src="images/Homepage1_ohne_07.gif" width="17" height="520" alt=""> </div>
<div id="Homepage1-ohne-08">
<img src="images/Homepage1_ohne_08.gif" width="545" height="438" alt=""> </div>
<div id="Homepage1-ohne-09">
<img src="images/Homepage1_ohne_09.gif" width="288" height="10" alt=""> </div>
<div id="Homepage1-ohne-10">
<img src="images/Homepage1_ohne_10.gif" width="288" height="197" alt=""> </div>
<div id="Homepage1-ohne-11">
<img src="images/Homepage1_ohne_11.gif" width="288" height="82" alt=""> </div>
<div id="Homepage1-ohne-12">
<img src="images/Homepage1_ohne_12.gif" width="545" height="81" alt=""> </div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>
Nun habe ich einfach den Teil <style></style> in eine Css-Datei gepackt und oben in die Html folgendes geschrieben: <link rel="stylesheet" type="text/css" href="xxx/rule.css"> Aber dabei zerschießt er mir immer die ganze Seite  Habt ihr vllt eine Idee? Vielen Dank!!! 
|
| Sponsored Links |
|
16.06.2009, 23:10
|
||||
|
||||
|
Hallo, einshoch!
Findest du es nicht sinnvoller dir CSS und HTML selbst beizubringen als diesen grausamen Code, den das Programm ausgespuckt hat entwirren? Ich schon. Denn was das Programm da gemacht hat ist einfach nur Müll. Es hat einfach nur die Grafik zerschnitten als <img>-Element in Divisionen gepackt und die mit "position:absolute" verteilt. So funktioniert Webdesign definitiv nicht. Lies dich mal hier ein, dann wirst du mich sehr schnell verstehen: Einführung in XHTML, CSS und Webdesign oder kauf dir die Bücher "Little Boxes 1" und "Little Boxes 2" von Peter Müller. Gruß
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ
|
| Sponsored Links |
|
16.06.2009, 23:26
|
|||
|
|||
|
Na ja, hat aber meiner Meinung nach ganz einfach den Vorteil das ich mein Design schnell in HTML und CSS umgesetzt habe, so brauche ich wenigstens nicht mehr alles "rumstückeln", was wäre denn deiner Meinung nach der bessere Weg?
|
|
16.06.2009, 23:31
|
||||
|
||||
|
Zitat:
 Zitat:
Jetzt legst du alles was mit Design zu tun hat bei Seite und schreib deinen HTML-Code nur alleine für den Inhalt, egal wie es aussehen soll. Wenn du damit fertig ist, schnappst du dir CSS und gestaltest die Sache mit Hilfe von Grafiken und den Farben, die du in deinem Design entworfen hast. Danach stresst du das Design: Schriftgrad verändern, Browserfenster hin und her ziehen, Grafiken aus, CSS aus, andere Browser usw. Geht dann immer noch alles und sieht gut aus. Bist du fertig. Ja, dass ist mehr Arbeit und das kostet auch Zeit und Geduld, aber so wird es nunmal gemacht. Mal von den persönlichen Vorlieben abgesehen. Aber was dein Programm da macht ist einfach nur Murks und nicht Praxis tauglich!
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ
|
|
17.06.2009, 07:39
|
||||
|
||||
|
Ich schließe mich Crizzo an, das ist Murks, was da rauskommt.
Aber zum Problem: Kann es sein, dass Du die style-Tags mit in die CSS-Datei übernommen hast? In die CSS-Datei darf nur das zwischen den style-Tags, auch HTML-Kommentare gehören nicht in die CSS-Datei.
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| Little Boxes Teil 1: Crashkurs zu HTML und CSS online lesen | pmmueller | Ressourcen | 6 | 25.02.2010 16:17 |
| css in html einbinden?! | Inrav3 | CSS | 7 | 16.02.2010 16:23 |
| CSS in HTML einbinden | Touch_Freak | CSS | 3 | 31.01.2010 20:48 |
| CSS in HTML - Hintergrundbild wird nicht angezeigt | fossy | CSS | 7 | 11.10.2007 18:17 |
| css box design in header und footer trennen | GateKay | CSS | 1 | 08.01.2005 15:54 |
Linear-Darstellung
