Материали и полезни връзки



<!DOCTYPE html>
	<html>
		<head>
			<meta charset='UTF-8'>
			<title>Practice</title>
			<link rel="stylesheet" href="style.css">
		</head>
		
		<body>
			<div id="main-container">
				<header>
					<nav>
						<ul>
							<li><a href="#">Home</a></li>
							<li><a href="#">Practice</a></li>
							<li><a href="#">Exams</a></li>
						</ul>
					</nav>
					
					<h1>CSS practice</h1>
				</header>
				
				<section>
					<article>
						<h2 class="article-header">Some artcile</h2>
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
						Pellentesque rhoncus sapien at orci blandit dignissim. 
						Etiam sed laoreet leo. Ut vel metus nisl. 
						Praesent tincidunt, diam in laoreet sollicitudin, tortor elit 
						mollis augue, nec laoreet nibh enim et nulla. Nam consectetur 
						.</p>
						<footer>
							Author: Unknown <time datetime="2013-02-02">02.02.2013</time>
						</footer>
					</article>
					
					<article>
						<h2 class="article-header">Some artcile</h2>
						
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
						Pellentesque rhoncus sapien at orci blandit dignissim. 
						Etiam sed laoreet leo. Ut vel metus nisl. 
						Praesent tincidunt, diam in laoreet sollicitudin, tortor elit 
						mollis augue, nec laoreet nibh enim et nulla. Nam consectetur 
						.</p>
						<footer>
							Author: Unknown <time datetime="2013-02-02">02.02.2013</time>
						</footer>
					</article>
				</section>
				
				<aside>
					<div class="ad brown">Advertise</div>
					
					<div class="brown">Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
						Pellentesque rhoncus sapien at orci blandit dignissim. 
						Etiam sed laoreet leo. Ut vel metus nisl.</div>
						
					<div class="ad brown">Advertise</div>
				</aside>
			</div>
		</body>
html, body, header, section, nav, ul, li, article,h1, h2, h3, h4, time, aside{
	margin:0;
	padding:0;
}

header{
	background-color: #ffa757;
	padding-bottom: 25px;
	border-bottom: 2px dotted #2f7786;
}

h1{
	color:#2f7786;
	display: inline;
}

nav, nav ul{
	display: inline;
}

nav ul li{
	background-color: #2f7786;
	display:inline;
	padding: 10px 20px;
	border-bottom-right-radius: 15px;
}

a:link {
	font-size: 22px;
	color: #fff;
	text-decoration: none;
}

a:visited {
	color: #fff;
}

a:hover {
	text-decoration: none;
}

a:active {
	text-decoration: none;
}

#main-container{
	width:580px;
	margin-left: 10px;
}

section{
	background-color: #eee;
	width: 380px;
	padding:10px;
	float: left;
	
}

.article-header{
	background-color: #fc7b66;
	color: #fff;
	padding: 5px 20px;
	border-radius: 15px;
}

article{
	padding-top: 5px;
}

aside{
	width: 160px;
	float:right;
}

.ad{
	height: 90px;
}

.brown{
	margin-top: 5px;
	background-color: #b47860;
	color: #fff;
}

footer{
	text-align: right;
}

Демо file-овете от Screen Cast лекцията по CSS може да свалите от тук

Допълнителни материали по HTML и CSS



Регистрация за безплатен софтуер от Microsoft

Продължение от Безплатен софтуер от Microsoft за ученици и студенти

В настоящия материал ще разгледаме стъпка по стъпка процеса на регистрация в Dreamspark, в случай че учебното заведение не е включено в списъка.

    1. След регистрацията, преди да преминете към сваляне на софтуера трябва да изберете начин за потвърждаване на студентски/ученически статус verificationDreamspark registration
    2. В случай, че системата не разпознава избраното от вас име за учебно заведение изберете опцията “Don’t see your school?”
      Step 2 of the tutorial
    3. Ако не можете да намерите училището в списъка изберете опцията “Still can’t find …”
      Step 3 of the Dreamspark registration tutorial
    4. Попълнете формата като в полето “Attachment” ще трябва да прикачите снимка на документ от учебното заведение (студентска книжка / лична ученическа карта / бележник )
      Dreamspark registration
    5. Изчакайте отговор и сте готови.

Честито сдобихте се с лицензиран софтуер от Microsoft напълно безплатно!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s