Sunday, October 31, 2010

How to Use CSS for page layout:

As mentioned in my last post there is one more way to set your page layout and that is using CSS.
Now if you have a CSS file you can use it and embedd it in your web application.
Now how do we do that?
Lets make a simple CSS file in visual studio and link it in our default.aspx page:
1. In the solution's explorer write click on your website solution> select add new item> select stylesheet>rename it if you want.

Now that you have created a new CSS file lets add something in it..
I have created a style sheet and named it style1.css. and in this CSS file I have written some code, to change the background colour to grey and the text color to white. 
One important thing to note here is that Visual Studio's "intelllisence" features pops up and helps you out with commands if you have forgotten any.

Instead of writing code you can also write click between the braces and select bulid style and choose the style of your choice. Now how to add the CSS file to your default.aspx page or your master page?
simple..go to the source view and press and hold the your CSS file from the solution explorer and drag drop it between the head tag, right below the title tag:

And thtz it!!

Tutorial: Somthing about the page Layout..

There are actually two ways by which you can design your page layout.
1. Using tables.
2. Using CSS.

lets use these two ways one by one:

A table can be used to set a layout for your Web application. using a table is very simple:
In your web application in the defaulft page or your current web form:
do this:

    The table properties will apear and you can select some as per your requirements eg: rows, cols etc.

Well Look at CSS in the next post...