James' Blog tutorials

Total tutorials: 8
Rounded Corners in CSS3
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4057 clicks
Rounded Corners can be used in website layouts to remove the constant box layout. While there's nothing wrong with have a box layout. It's nice to get some rounded shapes too. In CSS3 a new element is hitting the scene, border-radius. Where someone can round off corners using one attribute, no images or position required!
The Shadow effect in CSS3
10. 8. 2008 in Css & XHTML | 1 Comments | Author: James' Blog | 4166 clicks
Shadow in website design is something that can be achieved by using CSS and images, to achieve shadow in CSS2 you would use images and positioning, it can be achieved but it usually means that you have to create multiple divs. But one of the exciting new attributes in CSS3 is box-shadow which allows someone to get a nice shadow effect with just using one attribute applied to a div.
Creating a glassy non div navigation bar
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4105 clicks
In this tutorial, no divs will be used, instead you will be forming a navigation bar using a unordered list. This tutorial will show you how to style and control lists in CSS, as well as showing you the valid ways of using lists and where to use them.
Creating a website navigation bar with CSS
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4274 clicks
There are many ways to create a navigation bar, you can use a programs like Photoshop and then convert the image into code, but when I see people creating them in Photoshop I think why bother? When you can simply use CSS for the whole creation and code of it. In this tutorial I will show you how to create a very clean navigation bar that will use one line of XHTML and the rest will be CSS.
Creating a glowing navigation bar
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4622 clicks
Adding glow can make things look special or stand out and it can be applied to lots of different things. Glow can be used in website designs, to make something look just a little more special than the average look. In this case im going to use glow and apply it to a navigation bar to make look a little bit more 'Wow' than the average navigation bar, using nicely coloured gradients and bit of CSS magic, im going to show you how to achieve a real nice navigation effect, which looks smooth, sleak and with a few little extras to make it stand out.
Website Layouts with sidebars
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4378 clicks
There are many different website layouts that are designed differently, many website layouts choose to have one or more sidebar, but a problem that you many encounter is how can you get the sidebar to be same length as your content? This is a good question, because if your sidebar ends before your content then your website layout will look strange. But there are methods of being able to achieve a sidebar that is the same height as your content. In this Quick CSS segment, im going to show you how you can achieve this effect, it's pretty simple and basic, but it's good to know!
Creating a Drop Down Navigation Menu
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 5607 clicks
Every tutorial I've done on navigation bars or menu's has been the normal one level navigation bar, but when you build a website you may feel the need to create sub categories, for example my blog houses various tutorials which are stored in categories, I have a drop down navigation bar on the main link, which is tutorials which then displays sub catergories and then the specific catergory e.g. Tutorials > XHTML > Basics in that example there are three levels. You can create navigation bar levels using lists, it's the easiest way to create a drop down menu but for styling it can get a bit tricky, but in this tutorial Im going to show you how to form a drop down navigation menu and then style it with CSS
Creating a Tabbed Navigation menu with under tab descriptions
10. 8. 2008 in Css & XHTML | 0 Comments | Author: James' Blog | 4071 clicks
Well in this tutorial you will learn how to create a tabbed navigation menu, complete with a under tab description feature, which when you hover on a certain tab a description will appear below the navigation bar.

Are you a website owner?
Click here to register and submit your tutorials!

Browse by category

Most popular tutorials