티스토리 뷰

AU Study/TAFE

CSS borders

Last72 2017. 8. 17. 18:57
To check the borders of each elements, we add border element at css file.
You can style the borders of an element's box.

To make it significant, width it. e.g.   border-width: 5px;
In addition, we can choose individual width, e.g.   border-width: 3px 1px 2px 1px;
Or more specify e.g.   border-left-width: 4px;
The border-width property allows you to set the thickness, or width, of a border.

Also, we can style it like two line or fancy lines. e.g. border-style: solid;
The border-style property allows you to change the style of border used.

We can choose color by rgb or hexa code e.g.   border-color: rgb(22, 77, 100);
The border-color property allows you to change the color of a border.

short hand need special order. e.g. border: 3px solid rgb(22, 77, 100);
Individually setting the style, thickness, and color of a border can bloat code. It's more efficient to use the shorthand border property and specify all three properties at once, in that order.

we can make round border to looks better. e.g.   border-radius: 5px;

Box borders don't have to be square. Their corners can be rounded with the border-radius property.css

'AU Study > TAFE' 카테고리의 다른 글

css chainging box model  (0) 2017.08.23
css box model  (0) 2017.08.23
W4 Fri afternoon  (0) 2017.08.17
W4 Fri morning  (0) 2017.08.17
W4 thu morning  (0) 2017.08.15
댓글
Announcement
Recent Posts
Recent Comments
Total
Today
Yesterday
Link
TAG
more
«   2025/01   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Search by month