자기소개에 쓸 수 있는 출석체크 버튼 만들기

팁/노하우 게시판 - 회원들의 다양한 IT/하드웨어 팁과 정보

공지 퀘이사존 규정(25.08.04)

퀘이사존

18k

03-16

17 자기소개에 쓸 수 있는 출석체크 버튼 만들기 하이앵두 18 2473 2018.04.30 23:23

안녕하세요. 하이앵두입니다. 제가 현재 자기소개에 적용해서 쓰고 있는 출석체크 버튼을 만드는 방법을 알려드리려고 합니다.우선 이 방법은 이미지로 버튼을 만드는 기존의 방법들과는 차이가 있으며 경우에 따라 복잡하게 느껴지실 수 있습니다. (HTML 코드를 어느 정도 보실 줄 아시는 분이시라면 어렵지 않게 하실 수 있습니다.) 먼저 결과물은 이렇습니다. <a href="https://www.quasarzone.co.kr/bbs/board.php?bo_table=qsz_check" class="btn btn-default"> 출석체크 하러가기!</a> 그럼 바로 만들어보도록 하겠습니다. 1. 아래의 코드를 복사합니다.<a href="<a href="https://www.quasarzone.co.kr/bbs/board.php?bo_table=qsz_check">https://www.quasarzone.co.kr/bbs/board.php?bo_table=qsz_check</a>" class="btn btn-default"> 출석체크 하러가기!</a> 2. 자기소개를 수정하기 위해 우측의 프로필 - 수정 버튼을 클릭합니다.<img src="https://img2.quasarzone.co.kr/img/data/editor/1804/02289a8d270773021d6ef9f9fa2c1938_1525096343_2813.png" title="02289a8d270773021d6ef9f9fa2c1938_1525096343_2813.png" style="max-width:100%; height:auto;">  3. 회원 정보 수정 페이지로 들어오셨으면 기타 선택사항 - 소개 입력란에 아까 복사했던 것을 그대로 붙여넣습니다. 4. 정보수정 버튼을 눌러 저장합니다. 5. 이제 입력한 것이 제대로 적용되었는지 우측 상단의 자신의 닉네임이 표기된 버튼을 눌러 나오는 페이지를 통해 확인합니다.<img src="https://img2.quasarzone.co.kr/img/data/editor/1804/02289a8d270773021d6ef9f9fa2c1938_1525096746_2374.png" title="02289a8d270773021d6ef9f9fa2c1938_1525096746_2374.png" style="max-width:100%; height:auto;">  어때요, 참 쉽죠?참고로 이 출석체크 버튼은 다른 용도로도 수정해서 쓰실 수 있으니 HTML 코드를 어느 정도 알고 계신 분이라면 아주 유용하게 쓰실 수 있으실겁니다 ㅎㅎ특히 퀘이사존의 경우 사이트 전체적으로 <a target="_self" href="http://getbootstrap.com/">부트스트랩</a>이 적용되어있기 때문에 버튼 디자인을 다른 걸로 쉽게 바꿀 수도 있습니다. 이렇게요. <a href="#" class="btn btn-default">버튼1</a> <a href="#" class="btn btn-primary">버튼2</a> <a href="#" class="btn btn-success">버튼3</a> <a href="#" class="btn btn-info">버튼4</a> <a href="#" class="btn btn-warning">버튼5</a> <a href="#" class="btn btn-danger">버튼6</a> 혹시라도 이렇게 버튼 디자인을 각양각색으로 만들어보고 싶으신 분들은 <a href="http://getbootstrap.com/docs/3.3/css/#buttons" target="_self">이 링크</a>를 참고하시면 되시겠습니다.자잘한 팁이지만 도움 되셨길 바랍니다.감사합니다. :)

하이앵두

행성: 해왕성

포인트: 5,427 exp

작성물 댓글

자기소개에 쓸 수 있는 출석체크 버튼 만들기 04-30

모든회원 자기소개 펼치기

댓글: 18개

팁/노하우 게시판 - 회원들의 다양한 IT/하드웨어 팁과 정보

공지 퀘이사존 규정(25.08.04)

퀘이사존

18k

03-16

전체 하드웨어 게임 콘솔 모바일 소프트웨어 기타

제목	닉네임	조회수	날짜
1 ClickFree (클릭프리) - 우클릭 금지, 복사 방지 사이트 원클릭으로 해제하는 무료 크롬 확장 0	user1149410	102	07-03
0 TalkShield (톡실드) - PC 카카오톡 광고 없애주는 무료 프로그램, 60KB 초경량 1	user1149410	247	07-03
0 [정보] RX 6500 XT / 6400 게임 중 무작위 재부팅 및 튕김 해결 통합 패치 (인텔/AMD PC... 0	user_1148167	140	06-25
0 간단 PC 테스트 사이트 0	sdfbiupsgmf	193	06-23
0 바우아토 BAUATO 짭플펜슬 (개인적인) 사용기 0	ELKalliance	111	06-21
0 알리산 Attack Shark R1 배터리 교체 0	ELKalliance	155	06-21
1 [제보]Synology NAS 2FA / Secure SignIn 관련 사용자 보호 이슈 1	user_1144668	277	05-31
0 9070xt 라데온 포르자 호라이즌6 스타터링 해결법 0	user_1123952	364	05-29
0 윈도우 게임 성능 최적화 레지스트리 설정｜FPS·입력지연·스터터링 줄이는 방법 2	user_1085356	706	05-13
0 갤북4프로360과 3090ti의 오큐링크 조합 및 자작쿨링시스템 후기 0	돌뉴	242	04-22
0 PC 유튜브 및 뮤직 동영상 재생불가 문제 0	poringle	544	04-13
0 스팀에서 원하는 금액만 충전하기 0	lamanus	724	03-15
0 모니터 주사율 관련 (feat. 제미나이) 0	dragonball	764	03-11
3 롤 프레임드랍 5	어택이	1.2k	01-13
1 게임 성능을 올리는 레지스트리 등 설정 1/5 2	티플레티넘	2k	01-04
1 미세스터터링 해결방법 1	인공지능	2k	01-02
0 AM4소켓 백플레이트 메인보드에 고정방법 0	신세계-이자성	883	12-22
0 가성비 CPU부터 최고의 CPU까지 2025 CPU TOP5(개인의견) 0	영재컴퓨터	4.6k	12-03
6 Mchose V9/V9 PRO 헤드셋 추가설정법 0	StayGlyde	8.3k	11-30
1 OBS 녹화 시 VRR 스터터링 해결 (OverlayMinFPS) 0	MouseSports	909	11-09
5 PC에서 콘솔처럼 영화적이고 부드러운 30프레임으로 똑같이 만드는 방법 9	아이엔에프피	4.4k	11-01
9 (팁)오디세이 G7 32DG702(700) 스마트 모니터 설정값 추천(HDR) 3	승길씨	11.8k	10-19
0 하이마트 발 오피스 홈&스튜던트 pc 옮길때 이전 설치 0	조조맹덕	588	10-15
0 써모랩 트리니티 120mm로 팬 교체하기 0	Kodorai	817	09-26
1 모니터 입력지연 줄이기 0	티플레티넘	1.5k	09-24
1 글카 성능 올리기 9/23 7	티플레티넘	3.4k	08-26
3 (팁) 라데온 쉬운 언더볼팅/오버클럭 방법 0	승길씨	5.3k	08-15
2 (팁)라데온 RSR, AFMF의 활용법 2	승길씨	2k	08-15
2 저장장치(HDD) 신품 구매하고, 불량섹터 검사하는 경우 0	폐지줍기달인	1.2k	07-27
0 컴퓨존 주문형 네이버페이는 네이버라인 신한카드 혜택 가능합니다. 2	닉바꾸기어렵다	1.3k	07-23