전체 글23 웹폰트 사용하는 방법 1. 구글 폰트에 들어갑니다. https://fonts.google.com/ Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 2. 나눔고딕 폰트가 보이네요. 이 폰트를 사용하겠습니다. 플러스 버튼을 누릅니다. 3. 플러스 버튼을 누르면 Family Selected라는 버튼이 보이는데요. 그 버튼을 클릭하면 아래와 같은 화면이 나옵니다. 4. 위 화면에서 standard에 있는 부분은 html의 head 안쪽에 붙여넣기 해줍니다. 그리고 아래의 Specify in CSS의 부분은 복사해서 스타일시트에 붙여넣기 해주시면 됩니다. 자세한 내용은 아래 코드팬을 참고하세요. See .. 2019. 12. 12. Inline과 Block 그리고 Inline-block의 차이점 Display: block - 블럭은 자신이 속한 영역 전체를 차지합니다. 즉, 블럭은 기본적으로 width 값이 100%입니다. - 블럭은 라인이 새롭게 추가 됩니다. - 블럭은 height값과 width 값, margin값 그리고 padding 값을 지정할 수 있습니다. Display: Inline - 인라인은 주로 텍스트를 기입할 때 사용합니다. 즉, 자신의 컨텐츠 영역이 자신의 width 값입니다. - 인라인은 라인이 새롭게 추가되지 않습니다. - 인라인은 width값과 height 값을 지정할 수 없습니다. - 인라인은 margin과 padding이 위와 아래에는 지정되지 않습니다. Display: Inline-block - 인라인 블럭은 줄바꿈이 되지 않습니다. - 인라인 블럭은 width값과.. 2019. 12. 11. 스킵 네비게이션(Skip Navigation)을 사용해야 하는 이유와 사용 방법 스킵 네비게이션은 웹 표준을 준수하기 위해 그리고 장애인도 평등하게 웹을 사용하기 위한 웹 접근성을 위해 꼭 설정해야 하는 요소 중 하나입니다. 웹표준에 대한 자세한 내용은 아래 웹 표준 사이트를 참고하세요. 1. 다음 웹표준 사이트 http://darum.daum.net/ 다룸, Darum 웹표준을 다루다 스니펫 데이터 수 76 last update 2014/09/30 darum.daum.net 2. 네이버 웹표준 사이트 https://nuli.navercorp.com/ 널리 : Sharing is Victory! : NULI nuli.navercorp.com 웹표준 준수를 위한 스킵 네비게이션(Skip Navigation) 만드는 방법 스킵 네비게이션을 만드는 html 코드와 css 코드는 아래 코드.. 2019. 12. 10. META Tag의 정의와 메타 태그의 종류 메타 태그란? HTML 문서의 메타 정보를 나타내는 태그를 의미합니다. 메타 정보 즉, Meta data(메타 데이터)는 html 페이지에 표시 되지 않습니다. 페이지에 대한 설명, 키워드, 제작자 및 각종 정보를 지정하고 표시하는 데 사용합니다. 메타 태그의 종류 대략적인 메타 태그에 대해 적어보겠습니다. 1) 키워드 지정 2) html 사이트 지정 3) 작성자 지정 4) 30초마다 새로고침 지정 5) 브라우저 호환성 지정 6) 인코딩 방식 지정 2019. 12. 9. 이전 1 2 3 4 5 6 다음
