본문 바로가기

웹개발

폰트 스타일 폰트 스타일 폰트와 텍스트 스타일 serif: 명조 san-serif: 고딕 cursive: 필기 monospace: 고정폭(주로 programming 코드를 보여줄 때 사용) 보통 body에 12px을 주는 경우가 많다. @font-face와 구글폰트 적용 폰트를 내 서버에 올리면 트래픽이 올라갈 수 있다 → 구글 웹 폰트 적용 ealry access webfont ⇒ 한국어 가능한 폰트 확인 가능 단어 깨트리기, 줄바꿈 지정하기 word-break, white-space p{ text-align: justify; word-break: break-all; } 더보기
css 기초 css 기초 css 파일에 '@charset "utf-8";'을 사용해서 문자열 인코딩에 대비하는게 좋다. 길이의 단위 px: 1px을 1로 한다. 창의 크기랑 관계가 없다. 모니터 해상도에 관련있다. em: font의 높이를 1로 한다. rem: root font 기준 %: 브라우저의 viewport에 관계가 있다. 선택자 우선 순위 element > element : 자식 선택자만 선택하고 싶을때 사용한다. element + element: 형제 엘리먼트를 선택할 때 사용한다. [attribute]: 속성 선택자이다. [attribute=value]: 정확한 value의 속성을 가지고 있는 요소만 찾는다. [attribute^=value]: 해당 value로 시작하는 속성 값의 요소를 .. 더보기
각종 html 요소 알아보기 각종 html 요소 알아보기 문자 실제 참조와 수치 문자 참조 적용 문자를 풀어서 쓰는 여러가지 방법이 있다. xml, XHTML에서는 문자 참조를 엄격하게 다뤘지만 HTML에서는 유연해졌다. 는 태그로 인식하기 때문에 화면에 텍스트가 나타나지 않는다. 로 표현한다. xhtml에서는 숫자 문자 참조를 더 권장한다. 구문을 강조하거나 하이라이팅 지정하기 strong, em, mark em은 주관적인 강조이다. strong은 객관적인 강조이다. mark는 주위를 환기하는 강조이다. 어떤 내용을 설명하기 전에 그것에 대한 결론을 먼저 이야기 할 때 사용한다. 형광펜 느낌! 단의어 정의와 약어, 작품의 제목 표현 dfn, abbr, cite dfn: 단어의 정의, 뜻 abbr: 약어 cite: 작품 제목 .. 더보기
자바스크립트 클로저(javascript closures) Closures 0. Closure 정의 'A closure is the combination of a function and the lexical environment within which that function was declared' 클로저에 대한 MDN의 정의입니다. 클로저는 선언되었을 때의 렉시컬 환경에 영향을 받습니다. 따라서 클로저를 알기 위해선 **Lexical Scope**에 대한 이해가 필요합니다. 1. Lexical Scoping function showName() { const name = "Kim"; // name은 showName 함수 내부에 생성된 지역 변수입니다. function displayName() { // displayName() 은 내부 함수이며,클로저입니다. c.. 더보기
자바스크립트 비동기(Call Back & Promise) javascript asynchronous - Call Back & Promise 1. javascript는 동기식 언어입니다. javascript는 싱글 스레드이며 동기식 언어입니다. 스레드가 하나이기 때문에 한가지의 프로세스를 이어갈 수 있으며 현재 일이 끝나지 않는다면 프로그램은 blocking됩니다. 즉, 한가지 일만을 수행할 수 있으며 현재 일이 끝나지 않은 경우에 다음 작업을 할 수 없기 때문에 프로그램은 중지된 것처럼 보입니다. 웹 사이트에서 얼마간의 대기 시간을 필요로 하는 경우는 생각보다 많습니다. 네트워크 응답 대기, 사용자 입력 대기 등... 기약없는 응답을 기다리는 상황은 언제든 필요할 수 있는데요. 이런 상황에서도 프로그램은 다음 작업을 처리하여 매끄럽게 진행돼야 합니다. 비동기 .. 더보기