Moja 1 strona-ocena

pytanie zadane 12 września 2017 w Ogłoszenia, zlecenia przez Regolin542 Użytkownik (990 p.)

Witam. Dzisiaj stworzylem swoja 1 strone z uzyciem CSS i HTML i prosilbym o ocene. Chetnie przyjme jakiekolwiek krytyki. Kod zrodlowy ponizej

<!DOCTYPE html>
<html lang="pl">
	<head>
		<title>Strona Glowna</title>
		<link rel="stylesheet" type="text/css" href="style.css" />
	</head>
	
	<body>
		<div id=header>
			<h1>Strona Glowna</h1>
		</div>
		
		<div id=nav>
			<h3>Nawigacja</h3>
				<ul>
						<li><a class="selected" href="">Strona Glowna</a></li>
						<li><a href="">About</a></li>
						<li><a href="">Kontakt</a></li>
				</ul>
		</div>
		
		<div id="r1">
		<div class="text1">
				Sample Text
				</div>
			<div>   
				<a href="http://..."><img src="a.jpg" width="500" height="300"/></a>
			</div>
			
		</div>
		
		<div id="r2">
		<div class="text1">
				Sample Text
				</div>
			<div>   
				<a href="http://..."><img src="aa.jpg" width="500" height="300"/></a>
			</div>
			
		</div>
		
			<div id="r3">
		<div class="text1">
				Sample Text
				</div>
			<div>   
				<a href="http://..."><img src="aaa.jpg" width="500" height="300"/></a>
			</div>
			
		</div>
		
		
	</body>
</html>

body {
    background-image: url("jdjd.jpg");
	font-family: "Comic Sans MS", cursive, sans-serif
}

a{
	text-decoration: none;
	color: white;
}

h1, h2, h3{
	margin: 0;
	color: white;
	font-size: 30px;
}

p {
    font-size: 24px;
}

#r1{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 570px; bottom:0; left: 70px; right:0;
    margin: auto;
}

#r2{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 570px; bottom:200px; left: 660px; right:0;
    margin: auto;
}

#r3{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 570px; bottom:200px; left: 1240px; right:0;
    margin: auto;
}

#nav ul{
	list-style-type:none;
	padding: 0;
	font-size:20px;
	
}

#nav{
	position: absolute;
    top: 10px; bottom:0; left: 60px; right:0;
}

#header{
	text-align:center;
}

komentarz 12 września 2017 przez xenonso Mądrala (5,160 p.)

Ten Comic Sans boli...

1 odpowiedź

odpowiedź 12 września 2017 przez marcin99b Szeryf (81,660 p.)

Rozdziel HTML i CSS na osobne pliki

Poczytaj o tagach HTML5 (np daj <nav>, zamiast pisać <div id="nav">)

Poczytaj o tagu <meta>

Poczytaj o RWD

Jak na pierwszą strone myśle że jest ok, z czasem sie nauczysz
Jak będziesz czuć się swobodnie w HTML + CSS, radzę ogarnąć JS i jakieś frameworki (np Bootstrap jest fajny)

komentarz 17 września 2017 przez Regolin542 Użytkownik (990 p.)

Pliki sa oddzielone. Co do RWD to dodalem do kodu z html'a taki skrawek kodu:

<style>

body { url("jdjd.jpg"); }
h1 { font-size:50px; }
@media screen and (max-width: 768px) {
    body { url("jdjd.jpg"); }
    h1 { font-size:20px; }
	
	#r1{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 370px; bottom:0; left: 70px; right:0;
    margin: auto;
}

#r2{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 770px; bottom:200px; left: 70px; right:0;
    margin: auto;
}

#r3{
	font-family: "Comic Sans MS", cursive, sans-serif;
	color:white;
	font-size: 30px;
	position: absolute;
    top: 1170px; bottom:200px; left: 70px; right:0;
    margin: auto;
}
}
</style>

Widze ze znasz sie na temacie i czy moglbysd mi powiedziec co o takim czyms sadzisz

komentarz 23 września 2017 przez marcin99b Szeryf (81,660 p.)

Nie znam sie na temacie

Po prostu zajmuje sie backendem na stronach i coś tam kojarze z fronta (bo musze)

komentarz 23 września 2017 przez marcin99b Szeryf (81,660 p.)

Co do kodu, dlaczego go powtarzasz?
CSS ma chyba opcje robienia po przecinku na raz robienia stylu dla kilku elementów na raz, a w tych elementach R chyba tylko pozycja sie zmienia
Albo zrób to na klasach, umieść wszystkie we wspólnej klasie i tej klasie nadaj style, po id idzie jedynie pozycja, która mogłaby też iść w atrybucie style="" w tagu html
zależy na ilu stronach ma być ten element, jak na 100% tylko na tej, to nie widze problemu... i powodu do zapychania css

Ale to tylko moja opinia, nie zajmuje sie tym na co dzień więc nie mam takiej wiedzy jak osoby od fronta