J
jumijumi
Gast
Hallo Leute,
ich arbeite gerade an einer HTML-Vorlage für ein Typo3-Template.
Problem:
Ich kann von div-Container ja die Ecken abrunden, mit border-radius.
Allerdings geht das im ie nicht, obwohl ich das im .css drin habe.
Außerdem habe ich noch die Frage, ob es für das Design der Seite noch Verbesserungsvorschläge gibt. (Wird eine Homepage für eine Schule, habe alles Links mal auf google.de geändert und die Menüpunkte umbenannt, Logo weggemacht etc.. Ist glaube ich klar.)
Habe den Ordner als Anhang reingestellt.
Wers nicht runterladen will: (Obwohl man sich die Webseite dann nicht angucken kann.)
Mit freundlichen Grüßen
jumijumi
ich arbeite gerade an einer HTML-Vorlage für ein Typo3-Template.
Problem:
Ich kann von div-Container ja die Ecken abrunden, mit border-radius.
Allerdings geht das im ie nicht, obwohl ich das im .css drin habe.
Außerdem habe ich noch die Frage, ob es für das Design der Seite noch Verbesserungsvorschläge gibt. (Wird eine Homepage für eine Schule, habe alles Links mal auf google.de geändert und die Menüpunkte umbenannt, Logo weggemacht etc.. Ist glaube ich klar.)
Habe den Ordner als Anhang reingestellt.
Wers nicht runterladen will: (Obwohl man sich die Webseite dann nicht angucken kann.)
Code:
<html>
<head>
<title>Titel</title>
<link rel="stylesheet" type="text/css" href="design.css">
<body link="#ffffff" vlink="#ffffff" alink="#ffffff">
</head><body style="background-image:url(bg.jpg); background-repeat:repeat-x">
<body>
<div id="webseite">
<div id="header">
<h1>Logo</h1>
</div>
<div id="menu">
<h1><a href="http://www.google.de/">Home</a>
<a href="http://www.google.de/">1</a>
<a href="http://www.google.de/">2</a>
<a href="http://www.google.de/">3</a>
<a href="http://www.google.de/">4</a>
<a href="http://www.google.de/">5</a>
<a href="http://www.google.de/">6</a></h1>
</div>
<div id="main">
<div id="diashow">
<h1>Diashow</h1>
<a href="http://www.google.de/"><img src="previous.png" width="125" height="34" alt="previous"></a>
<a href="http://www.google.de/"><img src="next.png" width="125" height="34" alt="next"></a>
</div>
<div id="infosheader">
<h1>Informationen</h1>
</div>
<div id="infos">
<h1>Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet..</h1>
<a href="http://www.google.de/"><img src="previous.png" width="125" height="34" alt="previous"></a>
<a href="http://www.google.de/"><img src="next.png" width="125" height="34" alt="next"></a>
</div>
<div id="termineheader">
<h1>Termine</h1>
</div>
<div id="termine">
<h1>Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet..</h1>
<a href="http://www.google.de/"><img src="previous.png" width="125" height="34" alt="previous"></a>
<a href="http://www.google.de/"><img src="next.png" width="125" height="34" alt="next"></a>
</div>
</div>
<div id="footer">
<h1>Copyright © 2012, All rights Reserved.<a href="http://www.google.de/"></a></h1>
<a href="http://www.google.de/"><img src="contact.png" width="125" height="34" alt="contact"></a>
<a href="http://www.google.de/"><img src="search.png" width="125" height="34" alt="search"></a>
<a href="http://www.google.de/"><img src="login.png" width="125" height="34" alt="login"></a>
</div>
</div>
</body>
</html>
Code:
body {
background-color:white;
text-align:center;
}
#webseite {
width:980px;
margin:0 auto;
}
#header {
width:980px;
height:65px;
background:grey;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#header h1 {
padding-top:20px;
font-size:30px;
font-weight:bold;
color:white;
font-family:Courier;
}
#menu {
width:980px;
height:40px;
background:darkorange;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
margin-top:20px;
clear:both;
border: 5px;
}
#menu h1 {
padding-top:10px;
font-size:20px;
font-weight:bold;
color:white;
font-family:Courier;
}
#diashow {
float:left;
width:480px;
height:512px;
background:white;
margin-top:10px;
margin-bottom:18px;
margin-right:10px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#infosheader{
float:right;
width:480px;
height:50px;
background:white;
margin-top:10px;
margin-bottom:1px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#infosheader h1 {
font-size:25px;
font-weight:bold;
color:grey;
font-family:Courier;
}
#infos{
float:right;
width:480px;
height:180px;
background:white;
margin-top:10px;
margin-bottom:10px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#infos h1 {
padding-top:2px;
font-size:16px;
font-weight:bold;
color:grey;
font-family:Courier;
}
#termineheader{
float:right;
width:480px;
height:50px;
background:white;
margin-top:20px;
margin-bottom:1px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#termineheader h1 {
font-size:25px;
font-weight:bold;
color:grey;
font-family:Courier;
}
#termine{
float:right;
width:480px;
height:180px;
background:white;
margin-top:10px;
margin-bottom:18px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
}
#termine h1 {
padding-top:2px;
font-size:16px;
font-weight:bold;
color:grey;
font-family:Courier;
}
#footer {
width:980px;
height:40px;
background:darkorange;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
margin-top:20px;
clear:both;
}
#footer h1 {
padding-top:10px;
font-size:20px;
font-weight:bold;
color:white;
font-family:Courier;
}Mit freundlichen Grüßen
jumijumi
Zuletzt bearbeitet:
)
