게시글내용중 버튼 문의입니다.
본문
보기와같이 버튼을 이용하고싶은데. 그대로 소스퍼오니까
Limk #1 OpenLoad
이런식으로밖에 적용안되더라구요.
css 에서 무엇을 추가를해줘야하는지.. 자세한답변부탁드립니다
!-->답변 2
아래 소스를 붙여넣기 하셔서 원하시는데로 수정하시면 될듯합니다.
설명입니다.
0.공통 속성은 btn 클래스 에 작성, 배경색이 다르기 때문에 배경색은 개별적으로 설정
1.display:inline-block : a요소가 인라인 요소기 때문에 크기(width,height)를 선언해 주려면 블락요소로 변경해주어야 합니다.
2.글자의 세로 가운데 정렬 line-height 로 처리
3.;border-radius:3px; 박스 모서리 둥글리기
4.text-align:center; 글자정렬 가운데로
5.text-decoration:none : a링크 기본속성이 밑줄이 생기기 때문에 제거하기 위해 작성
<style type='text/css'>
.btn{display:inline-block;width:100px;height:30px;line-height:30px;border-radius:3px;color:#fff;text-align:center;text-decoration:none}
.btn_01{background:red;}
.btn_02{background:blue;}
.btn_03{background:green;}
</style>
<a class='btn btn_01' href="#">버튼</a>
<a class='btn btn_02' href="#">버튼</a>
<a class='btn btn_03' href="#">버튼</a>
답변을 작성하시기 전에 로그인 해주세요.