Posts

Showing posts from April, 2018
Genies Hour (7) CSS  Layout - float and clear Know CSS Float Properties The CSS  float  property specifies how an element should float. The CSS  clear  property specifies what elements can float beside the cleared element and on which side.                                                             What I have learned? The  float  property is used for positioning and layout on web pages. The  float  property can have one of the following values: left - The element floats to the left of its container right- The element floats to the right of its container none - The element does not float (will be displayed just where it occurs in the text). This is default inherit - The element inherits the float value of its parent The  clear  property specifies wh...
Post a Comment
Read more
Genies Hour (6) Position Know CSS Position Properties The  position  property specifies the type of positioning method used for an element. There are five different position values: static relative fixed absolute sticky                                                             What I have learned? An element with  position: static;  is not positioned in any special way; it is always positioned according to the normal flow of the page. An element with  position: relative;  is positioned relative to its normal position. An element with  position: fixed;  is positioned relative to the viewport, which means it always stays in the same place even if the page is scrolled. The top, right, bottom, and left properties are used to position the element. An element with ...
Post a Comment
Read more
Genies Hour (5) CSS  Border Know CSS Border Properties The CSS  border  properties allow you to specify the style, width, and color of an element's border.                                                           What I have learned? dotted  - Defines a dotted border dashed  - Defines a dashed border solid  - Defines a solid border double  - Defines a double border groove  - Defines a 3D grooved border. The effect depends on the border-color value ridge  - Defines a 3D ridged border. The effect depends on the border-color value inset  - Defines a 3D inset border. The effect depends on the border-color value outset  - Defines a 3D outset border. The effect depends on the border-color value none  - Defines no border hidden  - Defines a hidden border ...
Post a Comment
Read more
Genies Hour (2) HTML- Iframe ,block Know The <iframe> creates an inline frame, which embeds an independent HTML document into the current document. <div>A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can). What I have learned? Block level elements in HTML: < address > < article > < aside > < blockquote > < canvas > < dd > < div > < dl > < dt > < fieldset > < figcaption > < figure > < footer > < form > < h1 > - < h6 > < header > < hr > < li > < main > < nav > < noscript > < ol > < output > < p > < pre > < section > < table > < tfoot > < ul > < video >
Post a Comment
Read more
Genies Hour (4) CSS-background Know The CSS background properties are used to define the background effects for elements.  CSS background properties: background-color background-image background-repeat background-attachment background-position What I have learned? ~ The  background-color  property specifies the background color of an element. a valid color name - like "red" a HEX value - like "#ff0000" an RGB value - like "rgb(255,0,0) ~ The  background-image  property specifies an image to use as the background of an element. ~T he  background-image  property repeats an image both horizontally and vertically. ~ If the image above is repeated only horizontally ( background-repeat: repeat-x; )  To repeat an image vertically, set  background-repeat: repeat-y; ~ The position of the image is specified by the  background-position  property ~ To specify that the background image should be fixe...
Post a Comment
Read more
Genies Hour (3) HTML- Class,Id Know The  class  attribute specifies one or more class names for an HTML element. The class name can be used by CSS and JavaScript to perform certain tasks for elements with the specified class name. What I have learned < style > .city   {     background-color :  tomato ;     color :  white ;     padding :  10px ; }   < /style > < h2   class ="city" > London < /h2 > < p > London is the capital of England. < /p > < h2   class ="city" > Paris < /h2 > < p > Paris is the capital of France. < /p > < h2   class ="city" > Tokyo < /h2 > < p > Tokyo is the capital of Japan. < /p > The class attribute can be used on  any  HTML element. The class name is case sensitive! Different tags, like  <h2>  and  <...
Post a Comment
Read more