https://nuli.navercorp.com/data/convention/NHN_Coding_Conventions_for_Markup_Languages.pdf 최신판은 아니지만 읽어보면 유용하다.

[CSS] vw / vh를 알아보자 정리한 이유 vw, vh가 부모의 넓이에 영향을 받는 줄 알았지만, 화면의 너비에 영향을 받는다는 점에서 정리를 통해 다시 알아보고자 한다. 먼저 말하자면 vw, vh 는 부모의 넓이에 영향을 받지 않는다!!! 단위와 의미 vw / Viewport Width viewport 너비에 근거. 1vw는 viewport의 넓이 1%와 같다. vh / Viewport Height viewport 높이에 근거. 1vh는 viewport의 높이 1%와 같다. vmin / Viewport Minimum viewport의 (높이와 너비 중) 작은 쪽의 치수로 기준. viewport 높이가 더 작은 경우, 1vim = viewport 높이 1% viewport 너비가 더 작은 경우, 1..

swiper slide 양 옆 공백만들기 Slide 01 Slide 02 Slide 03 Slide 04 Slide 05 Slide 06 slidesOffsetBefore 전체적인 슬라이드 왼쪽에 공백을 준다.slidesOffsetAfter 전체적인 슬라이드 오른쪽에 공백을 준다.

https://ossam5.tistory.com/116 [HTML기초문법] 15강 SVG태그 Stroke속성 - 오쌤의 니가스터디 1. SVG 태그란? - SVG태그는 Scalable Vector Graphics의 약자로 벡터 기반 그래픽을 XML 형식으로 정의하는 것을 의미합니다. - SVG태그는 SVG그래픽을 담기 위한 요소입니다. - SVG태그 내부에 담을 수 있는 ossam5.tistory.com https://velog.io/@gicomong/css100-day-8 svg에 애니메이션 넣기 svg에 그려지는 효과 주기 velog.io

HEADING Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit possimus necessitatibus natus a ipsam, voluptate dolores, optio quibusdam doloribus architecto obcaecati, eveniet magni ex veniam dolorum blanditiis tempora exercitationem ea! Voluptatem voluptate nulla recusandae debitis tempora rem maxime provident nobis minus neque quod excepturi molestiae sapiente, fuga ducimus sint qui..

조건 btn이 여러개 일 때 btn 클래스를 가진 요소가 모두 fix. visual일 때는 btn이 보이지 않아야 한다. resize에도 가능. 일단 코드! header visual cnt01 cnt02 cnt02 footer /* 모든 css 동일 */ * { margin: 0; padding: 0; box-sizing: border-box; } .wrap { position: relative; width: 100%; height: 100%; } header, footer { width: 100%; height: 70px; position: relative; background-color: #eaeaea; } footer { height: 200px; } section { position: relati..

const theme = localStorage.getItem('theme'); // console.log(theme); // 현재 theme를 알 수 있음. // dark || light if(theme) { document.documentElement.SetAttribute('data-theme', theme); } localStorage :: Storage 객체는 단순한 key-value 저장소이며, 이는 객체와 비슷하다. 이 데이터들은 페이지 로딩에도 온전하게 유지된다. (다시 웹페이지에 접속 할 때 마지막 설정을 불러올 수 있다.) localStorage getItem(key) :: 키에 해당하는 값을 받아온다. setItem(key, value) :: 키, 값을 보..

목차 1 배경 2 일반 2.1 일반 스타일 규칙 2.2 일반 서식 규칙 2.3 일반 메타 규칙 3 HTML 3.1 HTML 스타일 규칙 3.2 HTML 형식 규칙 4 CSS 4.1 CSS 스타일 규칙 4.2 CSS 서식 규칙 4.3 CSS 메타 규칙 1 배경 이 문서는 HTML 및 CSS에 대한 형식 및 스타일 규칙을 정의한다. 협업, 코드 품질을 개선하고 지원 인프라를 활성화하는 것을 목표로 한다. 2 일반 2.1 일반 스타일 규칙 2.1.1 프로토콜(Protocol) 리소스에 HTTPS를 넣는 것이 좋다. HTTPS(https:) 는 이미지 및 기타 미디어 파일, 스타일 시트 및 스크립트에 붙이는 것이 좋다. /* 권장하지 않음 : 프로토콜 생략 */ @import '//fonts.google..