FRONT END(9)
-
부트스트랩 버튼 가운데정렬
제출 또는 제출
2021.01.07 -
모바일 웹에서 확대 기능 막기, 사이즈 고정하기
모바일 화면의 사이즈및 초기설정을 위한 태그. initial-scale : 초기 줌 배율 설정 maximum-scale : 최대 줌 배배 설정 minimum-scale : 최소 줌 배율 설정 user-scalable : 사용자가 확대/축소 가능여부 출처: https://yougome.tistory.com/210 [the Desirable Garfield]
2021.01.07 -
Bootstrap Panels
패널 - .panel-default 위와 같이 기본 색상에 문구가 담김. 클래스는 패널의 색상 스타일 지정 시 사용. A Basic Panel > 출력 : - .panel-heading / body / footer Panel Heading Panel Content Panel Footer > 출력 : - 패널 색상, 상황에 맞게 사용 .panel-default, .panel-primary, .panel-success, .panel-info, .panel-warning 또는 .panel-danger Panel with panel-default class Panel Content Panel with panel-primary class Panel Content Panel with panel-success cla..
2020.12.28 -
jQuery 정리
2020/12/04(금) - 문서가 완전히 로딩되고 나서 실행됨 $(document).ready(function() { alert('시작시 자동으로 호출됨') }); - 클릭된 항목을 숨기기 $("div#meclick").click(function() { $(this).hide(); }); ♣ ---> body블록 내 id meclick 실행, 글자 사라짐 - 클릭된 항목 색상 바꾸기 $('#hw').click(function() { alert('id 선택자를 이용한 호출'); $(this).addClass("magenta"); }); }); ---> body블록 내 id hw 실행, class yellow로 변경 css메소드에 대하여 실습 ** this는 태그가 담긴 변수를 불러올 때, self는 메소..
2020.12.04 -
css
2020/12/02 목록을 이용해 가로형태의 메뉴 만들기 #pipe { margin-left: 0px; width: 550px; padding: 5px; border: 1px solid #000000; } #pipe li { ---> 테두리 생성 margin-left: 0px; padding: 3px 15px; list-style: none; border: 1px solid #000000; } #pipe li.first { ---> 가로로 정렬 margin-left: 0px; border-left: none; list-style: none; display: inline; } #pipe a { ---> ul태그 내의 a태그 margin-right: 5px; text-decoration: none; font..
2020.12.02 -
css
2020/12/01(화) 그림자 효과 만들기 테이블에 관련된 속성 알아보기 테이블에 관련된 속성 알아보기 요소의 표시와 배치 top / bottom / left / right / width / height 속성을 사용한 해당 요소들의 위치 조정 (원활한 실습을 위해 요소들의 position속성은 absolute로 설정) #mydiv{ position:absolute; top:0px; left:0px; width:300px; height:200px; background: red; } .test1{ /* 소녀시대 */ position:absolute; top:30px; left:30px; background:aqua; } .test2{ /* 원더걸스 */ position:absolute; top:100px;..
2020.12.01