css3 rounded border, border shadow_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:34:40
Original
1738 people have browsed it

border-radius adds a rounded border to an element, in css3. IE9 chrome safari5 firefox4 are now supported. Borders can be set to input divs, etc. Similar to border, the four corners can be set together or individually.

Syntax: border-radius: 1-4 length|% / 1-4 length|%;

-moz-border-radius:10px; supports old firefox

-webkit-border-radius:10px;Supports chrome

Set the value of each radius in the order of top-left, top-right, bottom-right, bottom-left. If bottom-left is omitted, it is the same as top-right. If bottom-right is omitted, it is the same as top-left. If top-right is omitted, it is the same as top-left.

Example 1:

border-radius:2px;

Equivalent to:

border-top-left-radius:2px;

border-top-right-radius:2px;

border-bottom-right-radius:2px;

border-bottom-left-radius:2px; >Example 2:

Border-radius:2em 1em 4em / 0.5em 3em;

Equivalent to:

border-top-left-radius:2em 0.5;

border-top-right-radius:1em 3em;

border-bottom-right-radius:4em 0.5em;

border-bottom-left-radius:1em 3em ;

box-shadow adds one or more shadows to the box. IE9, Firefox 4, Chrome, Opera, and Safari 5.1.1 support the box-shadow attribute.

Syntax: box-shadow: h-shadow v-shadow blur spread color inset;

h-shadow, v-shadow are required. Horizontal and vertical shadow position. Assignment is allowed. blur optional, blur distance. spread optional, the size of the shadow. color optional, the color of the shadow. inset is optional and changes the outer shadow (outset) to the inner shadow.

Example: box-shadow: inset 3px 3px 6px #ccc;

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template