끄적이는 퍼블리셔♥

1. 한글 Notosans(본고딕) 주로 많이 사용하는 폰트이다. 2. 영문 SourceSansPro(소스산스프로) https://fonts.google.com/specimen/Source+Sans+Pro

@font-face { font-family: "NotoSansKR"; src: url("../fonts/notoSansKR/NotoSans-Bold.woff") format("woff"); font-style: normal; } @font-face { font-family: "OpenSans"; src: url("../fonts/openSans/OpenSans-SemiBold.woff") format("woff"); unicode-range: U+0020-007E; font-style: normal; } body { font-family: 'NotoSansKR', 'OpenSans'; } font-face에 unicode-range 속성을 사용하면 된다. unicode-range는 특정 범위가 글꼴만 ..

HTML 삽입 미리보기할 수 없는 소스

내가 자주 사용하는 단축키를 정리해보았다. 작업 페이지 이동(우측) : Ctrl + Tab 작업 페이지 이동(좌측) : Ctrl + Shift + Tab 레이어 복제 후 새레이어로 추가: Ctrl + J 새 레이어 추가: Ctrl + Shift + N 회전, 왜곡 등 변형 : Ctrl + T 누른뒤 Ctrl 누르고 마우스 드래그하여 변형 상단메뉴바 사라졌을때: Tab키 누르면 원상복구 된다.

1. z-index는 relative, absolute, fixed를 줬을때 먹는다. z-index는 position 속성이 기본인 static 속성일때는 먹지 않는다. 그래서 꼭 relative나 absolute, fixed를 줬을때 먹힌다. 2. z-index 먹는순서 1) relative가 absolute보다 우선하기 때문에 z-index가 더 높게 적용된다. 2) 같은 absolute나 fixed 가 먹혀 있다면 나중에 나오는 태그가 더 높은게 디폴트다. 3. z-index 안먹을때 만약 z-index가 안먹을때는 position 속성을 줬는지 확인하고, 그래도 안되면 부모속성에 position: relative; 속성을 줘보자.

1. 인라인 요소(inline) label audio video b br before after -> 특징: 상하 마진값 못가짐 (좌우 마진은 가능 / 패딩은 상하좌우 모두 가능) 2. 인라인블록 요소(inline-block) input button img fontawesome icon -> 특징: 상하 좌우 마진, 패딩 가능 3. 블록 요소(block) form article details summary h hr -> 특징: 상하 좌우 마진, 패딩 가능 margin: auto는 블록만 가능

1. a 태그의 href에 해당 영역 아이디값으로 넣어주기 ex) dsfdsfasdfasdfadf 2. 원하는 영역(div에 id 값 같은걸로 넣어주기) ex) 3. CSS로 html에 scroll-behavior: smooth; 넣어주기 ex) html { scroll-behavior: smooth; } * IE에서는 안먹으니 참고 /

a href="#" 상단으로 이동(클릭시 스크롤 상단으로 이동함) a href="#none" 페이지가 없다는뜻(스크롤 이동 안함)