<

Introduction to CSS (Part 1)

Posted on
6,062 Points
62 Views
Last Modified:
Experience Level: Beginner
5:20
The viewer will receive an overview of the basics of CSS showing inline styles.

Video Steps

1. In the head tags set up your style tags


<style>

</style>

Open in new window

2. Reference the nav tag and set your properties.

nav {position relative; left: 0; top:10%;}

Open in new window

3. Set the reference for the UL element and styles for it to ensure no browser defaults are present

nav>ul {list-style-type: none; width:100%; height:3em; padding:0; margin:0;}

Open in new window

4. Position the list elements in line on one row with a width of 60 pixels

nav>ul>li{display:inline; width:60px;}

Open in new window

5. Create your navigation menu as follows


			<nav>
				<ul>
					<li class="mysite"><a href="#">Home</a></li>
					<li class="mysite"><a href="#">Contact</a></li>
					<li class="mysite"><a href="#">About</a></li>
				</ul>
			</nav>

Open in new window

0
Comment
Author:Jason Baker
0 Comments

Featured Post

[Webinar] How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them.

Join & Write a Comment

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
Suggested Courses

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month