본문 바로가기

전체 글23

IR 기법(Image Replacement)의 의미와 종류 그리고 사용 방법 IR 기법(Image Replacement)은 무엇인가? - IR 기법은 이미지의 대체텍스트를 제공하기 위한 CSS 기법으로 아래와 같이 다양한 CSS 기법을 사용하여 이미지의 대체 텍스트를 제공할 수 있습니다. IR 기법(Image Replacement)의 종류 Phark Method - 의미있는 이미지의 대체 텍스트를 제공하는 경우에 사용합니다. - 이미지로 대체할 엘리먼트에 배경이미지를 설정하고 글자는 text-indent를 이용하여 화면 바깥으로 (-9999px만큼 내어 쓰기) 빼내어 보이지 않게 하는 방법입니다. .ir_pm {display: block; overflow: hidden; font-size: 0; line-height: 0; text-indent: -9999px;} WA IR - .. 2019. 12. 16.
HTML 과 CSS로 이미지를 표현하는 방법(Img/Background/이미지 스프라이트 기법) 다음의 세 가지 방법으로 이미지를 표현 할 수 있습니다. Img 태그 - 이미지의 의미가 있을 때 Img 태그를 사용합니다. - Alt 태그를 이용해서 대체 문자를 적어야 합니다. Background 속성 - 이미지가 의미가 없을 때 background 속성을 사용합니다. - 의미가 없기 때문에 대체 문자를 적을 필요가 없습니다. - background: url(이미지 주소) center top repeat-x; - background: url(이미지 주소) no-repeat 9px(가로) 8px(세로); 이미지 스프라이트 기법(Image Sprite) - 여러 개의 이미지를 하나의 이미지로 합쳐서 관리합니다. - 위 기법을 사용하면 이미지 관리가 용이하며 웹페이지의 로딩 시간 및 용량을 줄일 수 있습니.. 2019. 12. 15.
엔티티 코드(Entity Code)의 사용 이유와 종류 정리(사이트 추천) 엔티티 코드(Entity Code)란? 엔티티 코드란 Html 문서에서 특수 문자를 입력하기 위해 사용하는 코드 입니다. 요즘은 UTF-8을 주로 이용하기 때문에 특수문자가 깨지지 않지만 W3C는 엔티티 코드가 아닌 특수 문자는 오류로 인식하기 때문에 특수 문자는 엔티티 코드로 작성하는 것이 좋습니다. 사용 빈도수가 높은 엔티티 코드 정리 엔티티 코드 문자식 표현(Entity Code) 숫자식 표현(Entity Number) > › © © © " " " & & & (공백) 엔티티 코드(Entity Code) 참고 사이트 https://entitycode.com/ Entity Code - A Clear and Quick Reference to HTML Entities Codes About EntityCod.. 2019. 12. 14.
마진(Margin)과 패딩(Padding)의 차이와 입력 방법 마진(Margin)과 패딩(Padding)의 차이 - 마진(Margin)은 보더값을 기준으로 컨텐츠의 바깥쪽에 위치한 여백을 의미합니다. - 패딩(Padding)은 컨텐츠 안쪽의 여백을 의미합니다. 자세한 내용은 아래 사진을 보면 쉽게 이해가 가능합니다. 마진(Margin)과 패딩(Padding)의 입력 방법 마진 혹은 패딩을 입력 방법에 대해 알아 보겠습니다. 기본적으로 입력 방법은 '위 -> 오른쪽 -> 아래 -> 왼쪽' 이렇게 시계 방향 순서라고 생각하시면 됩니다. 4개 값 입력 시 - 위 -> 오른쪽 -> 아래 -> 왼쪽 3개 값 입력 시 - 위 -> 오른쪽/왼쪽 -> 아래 2개 값 입력 시 - 위/아래 -> 오른쪽/왼쪽 1개 값 입력 시 - 위/아래/오른쪽/왼쪽 모두 동일한 마진 혹은 패딩값 자.. 2019. 12. 13.