▲
home html css javascript creation generator web button navbar images how Contact login Pages

css border image properties tutorial

  • Web html5, css3, javascript, php, sql, jquery, xml, ajax, web design & development, photo maker, SEO.
  • Online web design, along with everything you need for a complete website.
    • width
    • style
    • color
    • shorthand
    • collapse
    • spacing
    • image
    • block
    • block-start
    • block-end
    • css border properties tutorial.The border properties allow you to specify how the border of the box representing an element should look.This page have all borders properties css.
    • determines the image of the element's borders.
           

css Border image

The CSS border-image properties allows you to specify an image to be used instead of the normal border around an element.

The properties has three parts:

  • The image to use as the border
  • Where to slice the image
  • determines whether the middle sections should be repeated or stretched

    • border

  • The border-image properties takes the image and slices it into nine sections.
  • It then places the corners at the corners, middle sections are repeated or stretched as you specify.

    • border image 30 round

    the border image is 30 round, that there is meaning border image 30 round.

    demo1{ border: 10px solid transparent; padding: 15px; border-image: url(../images/border2.png) 30 round; }

      demo
    border image 30 round

    border image 30% round

    the border image is 30% round, that there is meaning border image 30% round.

    demo2{ border: 10px solid transparent; padding: 15px; border-image: url(../images/border2.png) 30% round; }

      demo
    border image 30% round

    border image 40% stretch

    the border image is 40% stretch, that there is meaning border image 40% stretch.

    demo3{ border: 10px solid transparent; padding: 15px; border-image: url(../images/border2.png) 40% stretch; }

      demo
    border image 40% stretch

    border image 20% stretch

    the border image is 20% stretch, that there is meaning border image 20% stretch.

    demo4{ border: 10px solid transparent; padding: 15px; border-image: url(../images/border2.png) 20% stretch; }

      demo
    border image 20% stretch

    border properties


    All Basic HTML5

    HTML is the main markup language for web pages, and its elements are the basic building blocks of web pages. HTML is written in the form of HTML elements consisting of tags enclosed in "greater than" and "less than" symbols within the content of the web page.


    All Basic CSS3

    CSS (Cascading Style Sheets) is a computer language that belongs to the category of style sheet languages used to control the appearance of a document written in a markup language.It is used to control the appearance of a document written in HTML and XHTML, that is, to control the appearance of a web page and a website in general.


    js JAVASCRIPT

    Javascript is a set of computer software and specifications developed by James Gosling at Sun Microsystems, later acquired by Oracle Corporation, which provides a system for developing application software and its development in a multi-platform computing environment.


    CREATIONS

    In this chapter I call creation I will present you creations html, css and javascript that are very useful and creative in a web site. You can get them ready-made with Netbax creations or create them yourself as you wish with the help provided by the Netbax editor.


    NAVIGATION Bar

    having easy-to-use horizontal & vertical menu is important for any web site. with css you can transform boring html menus into good-looking horizontal & vertical bars. horizontal & vertical menu is such an important part of your website. it’s how your visitors navigate to the main areas of your site and makes it easy for them to find.


    WEB BUTTONS

    Collection of hand-picked free HTML and CSS button code examples.In this article, we'll see some really cool looking responsive buttons using only a few lines of CSS.You are free to copy, modify and use this code as you wish.All the buttons shown here can scale accordingly to the font-size attribute, and should work in any relatively recent browser.

    Netbax Contact Us