After creating an element in style sheet, you can position that element at any location on your page. Usually, you create elements with the DIV tag and to position your DIV element, we use the attribute Position.
In other words, the position property changes how your div elements are positioned on the web page. It has different values and one can use as per the requirement of their website or blog page.
The Position attribute has 4 values:-
- Static
- Fixed
- Relative
- Absolute
What is the best value of position attribute?
Well, this question has very controversial answer and let's not discuss here as it is beyond the topic of this post.We are just giving some details about each value so that you can be familiar with all the 4 types of values of position attribute.
Static
This is the default value of an element of any HTML page. the static value element will appear in the normal flow.I suggest not to use static value; let the element appear on the position it is unless of until you don't use any other value to position on a specific area of page. Leave it.
Example for Static Value:-
/*Syntax of Static Value of Position Attribute in CSS*/
position:static;
position:static;
Fixed
Example for Fixed Value:-
/*Syntax of Fixed Value of Position Attribute in CSS*/
position:fixed;
position:fixed;
Relative
To position an element relatively places the element in normal flow. When uses, it overlaps the first element on the page.Example for Relative Value:-
/*Syntax of Relative Value of Position Attribute in CSS*/
position:relative;
position:relative;
Absolute
You can set the absolute position of an element with the Absolute value. It removes an element from the normal flow.Example for Absolute Value:-
/*Syntax of Absolute Value of Position Attribute in CSS*/
position:absolute;
position:absolute;
I have explained all the 4 values of Position attribute. If you still have any doubt in understanding any value, you can give comment in below comment section.
NOTE:- To use these properties and relevant values of Position Attribute, read posts on each topic in the next section of this blog.
NOTE:- To use these properties and relevant values of Position Attribute, read posts on each topic in the next section of this blog.
0 comments:
Post a Comment