What were making
In this tutorial, we will be creating a web page that can be used for a gallery, an easy way of showing your portfolio of works or photography, etc.

The page will be coded in XHTML 1.0 Strict and CSS3 valid, our CSS won't even have any warnings on them apart from one.

So the first thing we need to do is set up a base structure for the XHTML. Below is the code for this.




As you can see, our DOCTYPE tells the browser that we are using XHTML 1.0 strict. What's the difference between HTML and XHTML? XHTML coding is a lot more clearer then HTML, since it all needs to be lowercase, it's horrible seeing uppercase tags such as these <META HTTP-EQUIV... nasty eh?

Our CSS will be styling divs, our main base structure will all be used with id in mind, because we are only using them once. So what do these divs do for us?

Container
This will contain everything in one, a simple way of keeping everything in order.

heading
This will be our heading. For this tutorial, we'll just do a simple text heading which will come later.

main
The main area of our content, just will keep our content areas in order.

left
The left area of our content, we can add large previews of the images here.

right
The right area of our content, where we will add the thumbnails of our images.

clear
This gets rid of any outstanding floating divs, it's crucial for floating divs to have this.

 

 

 

Reply