728x90 반응형 > 메모65 [CSS] 폰트 적용하기 (구글 폰트) 폰트 적용하기 (구글폰트) Browse Fonts - Google Fonts Browse Fonts - Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 해당 사이트 이용 사용할 폰트 검색 Get font 눌러주기 Get embeded code 눌러주기 @import 를 눌러주기 CSS 맨 위에 복사붙여주기 해주면 된다. 이렇게 CSS 맨 상단에 넣어줌. 그리고 적용하고 싶은 부분 font-family 찾아서 CSS 에 넣어주기 아이디 mclive 에 적용 font-weight 를 SemibBold로 적용하기 위해 600 으로 수정. 2024. 3. 27. [CSS] 자꾸 까먹는 가운데 중앙 정렬 텍스트 중앙정렬하기 맥도날드 라이브라는 글자를 중앙으로 오게하고싶음. HTML "MacDonald’s Live" style 태그를 추가해서 CSS 적용 text-align: center 이미지 중앙정렬 display:block; margin:auto; 2024. 3. 27. [JS] 폼 전송 막는 방법 폼 전송 막는 방법 콜백 함수에 e라는 파라미터 추가해주고 e.preventDefault() 라고 쓰기 HTML 전송 닫기 JS $("form").on("submit", function (e) { if (document.getElementById("email").value == "") { alert("아이디입력안함."); e.preventDefault(); } }); 2024. 3. 22. [JS] 헷갈리는 else if 사용 법 else if "그게아니면 만약에" 라는 뜻 else if 문의 경우 else 문의 특징도 가지고 있어서 조건식이 참이면 뒤에오는 else if문은 실행하지 않는다. 2024. 3. 22. [JS] input에 입력한 값을 찾는 방법 input에 입력한 값을 찾는 방법 = document.getElementById('인풋태그찾고').value 2024. 3. 22. [HTML] form 태그 안에 button 만들 때 주의점 전송 버튼은 type 을 무조건 submit 으로 지정해줘야하고 그 외의 버튼은 type 을 button 으로 지정해줘야함 이렇게 만들어야 에러가 없다 전송 닫기 2024. 3. 22. [CSS] display:none 대신 사용하는 visiblity CSS display=none; => 대상을 숨길 때 사용 => opacity: 0; 도 사용 가능 visibility : hidden 을 써야 애니메이션이 잘 먹는다. .black-bg { visibility : hidden; opacity : 0; } .show-modal { visibility : visible; opacity : 1; } opacity: 0; 의 반대는 opacity: 1; 을 사용 visilbility: hidden 반대로는 visible 을 사용해주면 된다. transition : all 1s; = 1초에 걸쳐서 천천히 변하게 해달라는 의미 2024. 3. 21. [JS] 제이쿼리로 CSS 에서 사용하는 display:none; 사용하는 방법 CSS= display:none; 제이쿼리 = hide(); 그 外 ) .fadeOut() = 서서히 사라지게 .slideUp() = 줄어들며 사라지게 2024. 3. 21. [JS] querySelector 하고 제이쿼리 사용 차이 querySelector- css - = CSS= display:none; document.querySelectorAll('.hello').innerHTML = '바보'; 제이쿼리 - css - () 제이쿼리 = hide(); $('.hello').html('바보'); 제이쿼리와 자바스크립트 혼용 가능. $("#close").on("click", function () { document.querySelector(".black-bg").classList.remove("show-modal"); //$(".black-bg").toggleClass("show-modal"); }); "쿼리" 라는 말이 들어가면 css 처럼 쓰인다고 보자. 2024. 3. 21. 이전 1 ··· 4 5 6 7 8 다음 728x90 반응형
