Friday, 26 June 2015

BASIC CSS TAGS - CSS TUTORIAL Part -2

 B

 

 Background Properties:

background - Sets all the background properties in one declaration
background-attachment Sets whether a background image is fixed or scrolls with the rest of the                                                   page 
background-color   -          Sets the background color of an element
background-image  - Sets the background image for an element background-position Sets the                                                starting position of a background image 
background-repeat   - Sets how a background image will be repeated 
background-clip  -             Specifies the painting area of the background 
background-origin - Specifies the positioning area of the background images 
background-size        -       Specifies the size of the background images

Border and Outline Properties

border                               -           Sets all the border properties in one declaration  
border-bottom - Sets all the bottom border properties in one declaration
border-bottom-color - Sets the color of the bottom border
border-bottom-style         -           Sets the style of the bottom border 
border-bottom-width       -             Sets the width of the bottom border
border-color -             Sets the color of   the four borders
border-left - Sets all the left border properties in one declaration
border-left-color - Sets the color of the left border
border-left-style             -               Sets the style of the left border
border-left-width           -                Sets the width of the left border
border-right                    - Sets all the right border properties in one declaration
border-right-color           -              Sets the color of the right border
border-right-style           -               Sets the style of the right border 
border-right-width        -                 Sets the width of the right border 
border-style                  -                 Sets the style of the four borders
border-top - Sets all the top border properties in one declaration
border-top-color           -                Sets the color of the top border
border-top-style            -                Sets the style of the top border 
border-top-width           -               Sets the width of the top border
border-width - Sets the width of the four borders 
outline - Sets all the outline properties in one declaration 
outline-color                   - Sets the color of an outline 
outline-style                  -               Sets the style of an outline
outline-width - Sets the width of an outline
border-bottom-left-radius    -        Defines the shape of the border of the bottom-left corner 
border-bottom-right-radius - Defines the shape of the border of the bottom-right corner  
border-image                       -        A shorthand property for setting all the border-image-* properties
border-image-outset - Specifies the amount by which the border image area extends     beyond the border box border-image-repeat - Specifies whether the image-border should be repeated,                                                                   rounded or stretched 
border-image-slice      -      Specifies the inward offsets of the image-border
border-image-source         - Specifies an image to be used as a border
border-image-width          -           Specifies the widths of the image-border
border-radius - A shorthand property for setting all the four border-*-radius                                                                       properties
border-top-left-radius - Defines the shape of the border of the top-left corner
border-top-right-radius - Defines the shape of the border of the top-right corner
box-decoration-break box-shadow -  Attaches one or more drop-shadows to the box

Box Properties

overflow-x Specifies whether or not to clip the left/right edges of the content, if it overflows the element's content area
overflow-y Specifies whether or not to clip the top/bottom edges of the content, if it overflows the element's content area
overflow-style Specifies the preferred scrolling method for elements that overflow
rotation Rotates an element around a given point defined by the rotation-point property
rotation-point Defines a point as an offset from the top left border edge

Monday, 22 June 2015

BASIC CSS TAGS - CSS TUTORIAL Part -1

 Here i  am going to describe the tags,AlphabeticalIy Now beginning with the very initial letter.

A

 Animation Properties

   Property                      Description

@keyframes   -                     Specifies the animation 
 animation    -                       A shorthand property for all the animation properties below,                                                                                 except   the  animation-the -state property
animation-name   -              Specifies a name for the @keyframes animation
animation-duration  -           Specifies how many seconds or milliseconds an animation takes                                                                                            to complete  one cycle
animation-timing-function -  Specifies the speed curve of the animation
animation-delay -                 Specifies when the animation will start
animation-iteration -count - Specifies the number of times an animation should be played
animation-direction  -           Specifies whether or not the animation should play in reverse on                                                                                                        alternate cycles
animation-play-state  -        Specifies whether the animation is running or paused


 Alignment properties

     For aligning text , we use
       
     text-align              :                            left,right,center
    The align-items property specifies the default alignment for items inside the flexible    
     container.

       align -                                          items,   self,    content         

   Property                                             Description                               

      stretch                       The element is positioned to fit the conatiner
      center                        The element is positioned at the center of the container
     flex-start                      The element is are positioned at the beginning of the container
     flex-end                       The element is positioned at the end of the container
     baseline                       The element is positioned at the baseline of the container
     initial                            Sets this property to its default value
     inherit                           Inherits this property from its parent element