Important Notice:

Course Content
Float Property
0/1
Z-Index
0/1
CSS object-fit Property
0/1
CSS Visibility Property
0/1
CSS (Chapter 4) M2-R5.1
About Lesson

border-image-source

           इस Value द्वारा Image Source को Define किया जाता हैं। जिस Image को हम Border बनाना चाहते हैं।

Syntax:-       border-image-source: url(“image full path”);

border-image-slice

                border-image Property किसी Image को Border बनाने के लिए उस Image को 9 भागों में बांटती हैं। जिसे Technical भाषा में Image Slicing कहा जाता हैं इस Property की Values को Number px, Percentage में Define किया जाता हैं

Syntax:-            border-image-slice: number | % |;

border-image-width

       इस Value द्वारा Image Border की Width यानि मोटाई को तय किया जाता हैं। border-image-width Property की Value को px में Declare कर सकते हैं।

 Syntax:-     border-image-width: number;

border-image-outset

       इस Property द्वारा Content और Border के बीच की दूरी को Set किया जाता हैं। जिसे Number Value द्वारा Declare किया जाता हैं।

Syntax:-            border-image-outset: number;

border-image-repeat

            इस property द्वारा Border के Behave को Set किया जाता हैं कि Image Border किस प्रकार दिखाई दें। इस कार्य के लिए 3 Values का इस्तेमाल किया जाता हैं

  • stretch – इस Value द्वारा Image खींची जाती हैं ताकि वह Element Width को Cover कर सके.
  • repeat – इस Value द्वारा Image को Repeat किया जाता हैं.
  • round – इस Value द्वारा भी Element Width को Cover करने के लिए Image को Repeat करवाया जाता हैं.

Syntax:-            border-image-repeat: stretch | repeat | round;

border (shorthand):-

            इस property के द्वारा आप border की सभी properties की value define कर सकते है।

 Syntax:-       border : <border-width> <border-style> <border-color>;

 

 

border-image-source

          Image source is defined by this value. The image which we want to make border.

Syntax:-       border-image-source: url(“image full path”);

border-image-slice

                border-image property divides an image into 9 parts to create a border. Which is called Image Slicing in technical language. The values of this property are defined in Number px, Percentage.

Syntax:-            border-image-slice: number | % |;

border-image-width

         The width i.e. thickness of the image border is decided by this value. You can declare the value of border-image-width property in px.

 Syntax:-     border-image-width: number;

border-image-outset

          The distance between the content and border is set by this property. Which is declared by Number Value.

Syntax:-            border-image-outset: number;

border-image-repeat

        Through this property, the behavior of the border is set as to how the  image border should appear. 3 Values are used for this work

  • stretch – The image is drawn by this value so that it can cover the element width.
  • repeat – The image is repeated by this value.
  • round – By this value also the image is repeated to cover the element width.

Syntax:-   border-image-repeat: stretch | repeat | round;

border (shorthand):-

            Through this property you can define the value of all the properties of the border.

 Syntax:-       border : <border-width> <border-style> <border-color>;

error: Content is protected !!