Many corner borders implemented by CSS are available on the Internet, but these methods are complicated. Currently, the css3 standard provides a simple method to implement corner borders, elliptical corner borders, and image borders. In css3, the
1, border-image description, grammar Before CSS3, border can simply set some solid colors or several simple linetypes (such as solid,dotted,double,dashed , etc.).In CSS3 ,border-image implements a different picture effect for the border. Image >
Previous words?? The border is a common property of the CSS box model properties, CSS3, But the border properties have been re-glowing. This article describes CSS borders in detailBase style?? A border is a space-delimited collection style,
Chapter 4 CSS3 border image effects-original learning points of water:
1. Initial Research on Attributes
2. Attribute explanation
3. Abbreviations and versions
Lecturer: Li Yanhui
This chapter mainly discusses the effects of border image
The previous article in the "CSS3 getting started tutorial series" describes CSS3 in detail.RGBAUsage of features. Let's take a look at this article.CSS3Used to achieve the rounded Corner EffectBorder-radiusSpecific usage of attributes.
In the past,
Border properties in CSS3: Border-radius, Box-shadow, Border-imageRounded Corners: Border-radiusUsing the CSS3 Border-radius property, you can make a fillet for any element.If you specify only one value in the Border-radius property, 4 rounded
CSS3 border within the scope of Border-radius, box-shadow,border-image three attributes, in addition to some online information on the Border-color attribute of the multilateral box color also to CSS3, but after testing only Firefox support, and to
In the CSS3 introduced many new features, this article mainly introduced the CSS3 picture border border-image usage, has certain reference value, has the interest can understand
For CSS property border, I believe that all Web developers are very
CSS3 Border PictureWith the Border-image property of CSS3, You can use a picture to create a border: border-image is used instead of border-style, that is, the size of the border depends.And there is no border-shadow on the side of the Border-image.
Border-imageIt is shorthand for the following values:Border-image-source//Use absolute or relative address URLs to introduce picturesBorder-image-slice//Cut picture, value support: or where number is no unit,Border-image-width//width of the border
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.