Skip to main content

Posts

Lesson 11: Borders css

Lesson 11: Borders Borders can be used for many things, for example as a decorative element or to underline a separation of two things. CSS gives you endless options when using borders in your pages. border-width border-color border-style border The width of borders [border-width]

Lesson 10: Margin and padding css

Lesson 10: Margin and padding In the previous lesson you were introduced to the box model. In this lesson, we will look at how you can change the presentation of elements by setting the  margin  and  padding properties. Set the margin in an element Set the padding in an element Set the margin in an element An element has four sides: right, left, top and bottom. The  margin  is the distance from each side to the neighboring element (or the borders of the document). See also the diagram in  lesson 9  for an illustration.

Lesson 9: The box model css

Lesson 9: The box model The box model in CSS describes the boxes which are being generated for HTML-elements. The box model also contains detailed options regarding adjusting margin, border, padding and content for each element. The diagram below shows how the box model is constructed: The box model in CSS

Lesson 6: Links css

Lesson 6: Links You can apply what you already learned in the previous lessons to links (i.e. change colors, fonts, underline, etc). The new thing is that CSS allows you to define these properties differently depending on whether the link is unvisited, visited, active, or whether the cursor is on the link. This makes it possible to add fancy and useful effects to your website. To control these effects you use so-called pseudo-classes. What is a pseudo-class? A pseudo-class allows you to take into account different conditions or events when defining a property for an HTML tag. Let's look at an example. As you know, links are specified in HTML with  <a>  tags. We can therefore use  a  as a selector in CSS

Lesson 5: Text css

Lesson 5: Text Formatting and adding style to text is a key issue for any web designer. In this lesson you will be introduced to the amazing opportunities CSS gives you to add layout to text. The following properties will be described: text-indent text-align text-decoration letter-spacing text-transform Text indention [text-indent]

Lesson 4: Fonts css

Lesson 4: Fonts In this lesson you will learn about fonts and how they are applied using CSS. We will also look at how to work around the issue that specific fonts chosen for a website can only be seen if the font is installed on the PC used to access the website. The following CSS properties will be described: font-family font-style font-variant font-weight font-size font Font family [font-family]