CSS Combinators

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

CSS combinators are used to target specific areas of an HTML file. They are very useful as they prevent the programmer having to put too many "class=" attributes within the…

Continue Reading CSS Combinators

Responsive websites

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

This methodology used 'float' to position elements in the browser. <!-- index.html --> <!DOCTYPE html> <html> <head> <title>My website</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta charset="UTF-8"> <link rel="stylesheet" a href="browser-reset.css"> <link…

Continue Reading Responsive websites

Inserting images with HTML and CSS

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

Basic image with HTML index.html <!DOCTYPE html> <html> <head> <title>My website</title> <meta charset="UTF-8"> <link rel="stylesheet" a href="browser-reset.css"> <link rel="stylesheet" a href="style.css"> </head> <body> <div class="menu-content-wrapper"> <h1>My picture</h1> <img src="img/myImage.jpg" alt="park…

Continue Reading Inserting images with HTML and CSS

Wrappers – beginning to control layout

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

I've added a wrapper to my code. A wrapper essentially has several functions. index.html <!DOCTYPE html> <html> <head> <title>My website</title> <meta charset="UTF-8"> <link rel="stylesheet" a href="browser-reset.css"> <link rel="stylesheet" a href="style.css">…

Continue Reading Wrappers – beginning to control layout

Links within pages

If we create another page of a website, we can link to it within our website using the <a href> </a> tags. e.g. <a href="about_me.html">About me</a> If the file 'about_me.html'…

Continue Reading Links within pages

Styling text with css

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

First, let's start with just a basic HTML page. A link has been added as well so we can look at styling that too. index.html <!DOCTYPE html> <html> <head> <title>My…

Continue Reading Styling text with css

CSS classes and IDs

  • Post author:
  • Post Category:CSS
  • Post Comments:0 Comments

Classes and IDs are used to target specific elements in a page. Using classes index.html <!DOCTYPE html> <html> <head> <title>My website</title> <meta charset="UTF-8"> <link rel="stylesheet" a href="browser-reset.css"> <link rel="stylesheet" a…

Continue Reading CSS classes and IDs

Comments inside HTML and CSS

Often, it's a good idea to make comments in HTML and CSS code. These comments server the purpose to tell us in plain English what the code actually is, or…

Continue Reading Comments inside HTML and CSS