Categories
web

Building your first web page with HTML and CSS

Getting the HTML elements in place

Ok, let’s get writting some HTML. In the following video, I take you through writing your first HTML tags. I’ll also talk about using Codepen. Codepen is an online code editor, learning environment, and community for web development. We will be using it a lot, so sign up for an account right now. So, head over to Codepen and make your first pen.

The design we will be working with is a very simple news article page. I created the mock-up in Adobe XD. You can see the preview here.


Targeting and styling the elements with CSS

In the next video, we style the HTML element with CSS rules. A CSS style rule targets a particular HTML element and applies chosen values to various properties. For example, we could target all <p> elements and the value of red to the paragraph color property.

p {color: red;}

Here is a link to the logo used in this demo.

Here is the completed project including all HTML elements and CSS style rules.