티스토리 뷰

Language/HTML, CSS

CSS. Basic Button Styling

out of coding 2018. 3. 2. 12:29

간단하게 CSS로 Button의 Style을 수정하는 방법입니다.


1
2
3
4
5
6
7
8
9
10
.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}
cs


간단하게 이런 정도의 정의를 내릴수 있습니다.


1
2
3
4
5
.button1 {font-size: 10px;}
.button2 {font-size: 12px;}
.button3 {font-size: 16px;}
.button4 {font-size: 20px;}
.button5 {font-size: 24px;}
cs


그래서 이러한 형태로 버튼의 타입을 정의한 이후에 정해진 타입을 사용하면 되겠죠?


웬지 느낌이 안드로이드 xml 작성하던 것이랑 너무 같아서 친근함이 있고 재미도 있네요.

하나만 해야하는데 이것저것 하는게 너무 좋아서...


댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2024/12   »
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
글 보관함