Jump to content

ostatní Prvá Téma


ebabecka

Recommended Posts

Zdravím. Začal som sa učiť HTML/CSS a rozhodol som sa urobiť moju prvú 'tému'. Neviem či ju tak môžem nazvať, pretože ja nie som nejaký grafik, ale myslím že na môj prvý pokus to ujde.

Pracoval som na nej asi polhodinu a chcel som ju urobiť jednoduchú.

 

Obrázok:

https://imageshack.com/i/4jbbgfp

 

W3 Validator mi ukazuje len 2 varovania ktoré ale nie sú moc podstatné, takže táto téma je validna, na čo som hrdý. :)

 

Kód:

 

 

<!DOCTYPE html>
	<html>
		<head>
			<title>TITLE OF THE WEBSITE -- WELCOME</title>
			<style type="text/css">
				body {
					margin: 20px 500px 20px 500px;
					text-align: center;
				}
				
				#main {
					background-color: #CC2929;
					padding-left: 20px;
					padding-top: 5px;
					padding-bottom: 5px;
					padding-right: 20px;
				}
				
				#content {
					background-color: #D66B6B;
					padding-left: 20px;
					padding-top: 5px;
					padding-bottom: 5px;
					padding-right: 20px;
				}
				
				#footer {
					background-color: #CC2929;
					padding-left: 20px;
					padding-top: 5px;
					padding-bottom: 5px;
					padding-right: 20px;
				}		

			</style>
			
		</head>
		
		<body>
			<div id="main">
				<p style="font-size: 60px; font-family: Century Gothic; color: black;">welcome to my website</p>
				<a style="text-decoration: none; font-family: Century Gothic; font-size: 20px; color: black;" href="">home</a>
				<a style="text-decoration: none; font-family: Century Gothic; font-size: 20px; color: black;" href=""> forum</a>
				<a style="text-decoration: none; font-family: Century Gothic; font-size: 20px; color: black;" href=""> about</a>
				<a style="text-decoration: none; font-family: Century Gothic; font-size: 20px; color: black;" href=""> contact</a>
				<a style="text-decoration: none; font-family: Century Gothic; font-size: 20px; color: black;" href=""> donate</a>
			</div>
			<br />
			<div id="content">
				<h1 style="font-family: Century Gothic;"><em>lorem ipsum dolor sit amet, consectetur adipiscing elit</em></h1>
				<p style="font-family: Century Gothic; font-size: 20px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed condimentum dictum lacinia. Fusce eu bibendum metus, id accumsan nisi. Quisque a nisl eu leo ultrices gravida nec et turpis. Integer venenatis est tempus dolor mollis, nec feugiat lorem commodo.</p>
				<h1 style="font-family: Century Gothic;"><em>lorem ipsum dolor sit amet, consectetur adipiscing elit</em></h1>
				<p style="font-family: Century Gothic; font-size: 20px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed condimentum dictum lacinia. Fusce eu bibendum metus, id accumsan nisi. Quisque a nisl eu leo ultrices gravida nec et turpis. Integer venenatis est tempus dolor mollis, nec feugiat lorem commodo.</p>
				<h1 style="font-family: Century Gothic;"><em>lorem ipsum dolor sit amet, consectetur adipiscing elit</em></h1>
				<p style="font-family: Century Gothic; font-size: 20px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed condimentum dictum lacinia. Fusce eu bibendum metus, id accumsan nisi. Quisque a nisl eu leo ultrices gravida nec et turpis. Integer venenatis est tempus dolor mollis, nec feugiat lorem commodo.</p>
			</div>
			<br />
			<div id="footer">
				<p style="font-family: Century Gothic;">Copyright <a style="text-decoration: none; font-family: Century Gothic; color: black;" href="">title.com</a> © 2014</p>
			</div>
		</body>
	</html>

<!-- End -->

 

 

Dúfam že sa vám táto téma bude páčiť. Napíšte svoj stručný názor v čom by som sa mal vylepšiť a na čom by som mal popracovať, ďakujem.

PS: Viem že v kóde sa veľa vecí opakuje a je to tam nahádzané atď., nabudúce sa viac posnažím. :)

Link to comment
Share on other sites

No ak je to prvý pokus tak fajn ... každý musí nejak začínať. Čo sa týka hodnotenia tak tam toho veľa nieje .. sú tam tri kontajnery a pár riadkov textu v nich. Chcelo

by to upraviť graficky a trošku tomu dať viac než len tri kontajnery pod sebou. Jedno sa mi však nepáči najviac a to je spôsob akým využívaš kaskádové štýly.. nie je dobrým zvykom pridávať štýly pomocou atribútu style="" (pokiaľ to nie je fakt nevyhnutné) ..  je lepšie si oddeliť CSS od HTML pomocou externého dokumentu a ten následne len importovať do HTML hlavičky. Získaš tým väčší prehľad a lepšie by sa ti editovalo.

Ale inak na prvý pokus povedzme ,že ok.

Link to comment
Share on other sites

Máš pravdu s tým CSS. Je to nepriehľadné a všetko je to na sebe, nedá sa v tom orientovať. Začnem používať druhý spôsob, ktorý je efektívnejší a priehľadnejší.

Ďakujem za názor :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...