Skip to main content

Posts

Showing posts with the label CSS all Property and Example [How To]

Background CSS Properties and Example

The CSS Background Properties is used to change the background of elements. The elements can be - ü   html ü   body ü   footer ü   H1,H2 and so on ü   div ü   P ü   Your custom elements and so on This property is supported most of browsers like IE, chrome, safari etc. /* For HTML background color*/ html {      background : white ; } /* For HTML body background*/ body {       background : white ;     background-image : url ( "background.gif" );     background-repeat : repeat-x ; } /* For HTML body footer*/ footer {      background : black ; } /* For HTML H1 tag background color*/ h1 {     background : green ; } /* For HTML div background color*/ div {     background : lightblue ; } /* For HTML page P background color*/ p {     ba...

CSS3 Appearance Property Example [How To]

“How to write an Appearance property in CSS ”? A CSS Appearance property is used to change the appearing of element to resemble native UI using a platform native styling based on the user operating system theme. The appearance property is not supported most of browsers like IE , safari etc. Stayed Informed - CSS Properties Values and Examples CSS Syntax :- #divDemo { - moz - appearance : button; - webkit - appearance : button; appearance : button; background-color : red ; color : #fff ; height : 30px ; } Example as, <!DOCTYPE html> <html> <head> <style> #divDemo { - moz - appearance : button; - webkit - appearance : button; appearance : button; background-color : red ; color : #fff ; height : 30px ; } </style> </head> <body> <div id= "divDemo" ><b> Demo CSS for Appearance property! </b></div> </body...

CSS Align Self Property Example [How To]

“How to write align-self property using css”? The Align Self property is a sub property of “ Flexible Box ” and it is used to overrides the container's “ align-items ” property. Stayed Informed - CSS Properties Values and Examples Align Content Property Accepts 5 different values and it will be the same as “ align-items ”. 1.       centre, 2.       flex-end, 3.       flex-start,   4.       stretch and 5.       baseline CSS Syntax :- .align-self { width : 300px ; height : 200px ; border : 1px solid black ; display : - webkit - flex; - webkit - align - items : flex - start; display : flex; align - items : flex - start; } .align-self div { - webkit - flex : 1 ; flex : 1 ; } .self { - webkit - align - self : center ; align - self : center ; } Exaample as, <!DOCTYPE html> <html...

CSS all Property and Example [How To]

“How to write all property using css”? CSS All property is used to reset all selected elements properties except to “ direction ” and “ unicode-bidi ” and it is using component level resetting of styles. The “ initial ” is a default property. Stayed Informed - CSS Properties Values and Examples All Property Accepts 3 different values as, 1.       Initial, 2.       Inherit and 3.       unset CSS Syntax :- .ex1 { background-color : green ; color : white ; } .ex2 { background-color : green ; color : white ; all : inherit ; } .ex3 { background-color : green ; color : white ; all : initial; } .ex4 { background-color : green ; color : white ; all : unset; } Result look like, Without All Property, This is ex1. With All: Inherit Property, This is ex2. With All: Initial Property, This is ex3. With All: Unset Property, This is ex4.