HTML74 HTML 파비콘(Favicon) 즐겨찾기 아이콘은 브라우저 탭의 페이지 제목 옆에 표시되는 작은 이미지이다. HTML문서에 Favicon을 어떻게 추가할까? 원하는 이미지를 즐겨찾기로 사용할 수 있습니다. 또한 https://www.favicon.cc 과 같은 사이트에서 자신만의 즐겨찾기 아이콘을 만들 수 있다. 브라우저 탭의 페이지 제목 왼쪽에는 다음과 같은 즐겨찾기 이미지가 표시된다: 웹 사이트에 즐겨찾기 아이콘을 추가하려면 즐겨찾기 이미지를 웹 서버의 루트 디렉터리에 저장하거나, 이미지라는 이름의 루트 디렉터리에 폴더를 만들고 이 폴더에 즐겨찾기 이미지를 저장한다. 즐겨찾기 이미지의 일반적인 이름은 "favicon.ico"이다. 다음으로, 다음과 같이 요소를 "index.html" 파일에 요소 뒤에 추가한다: My Page Tit.. 2023. 5. 3. HTML <picture> 요소 HTML 요소를 사용하면 다양한 장치 또는 화면 크기에 대해 서로 다른 사진을 표시할 수 있다. HTML 요소 HTML 요소는 웹 개발자가 이미지 리소스를 지정할 때 더 많은 유연성을 제공한다. 요소에는 각각 srcset 속성을 통해 서로 다른 이미지를 참조하는 하나 이상의 요소가 포함됩니다. 이렇게 하면 브라우저는 현재 보기 및/또는 장치에 가장 적합한 이미지를 선택할 수 있습니다. 각 요소에는 이미지가 가장 적합한 시기를 정의하는 media 속성이 있습니다. picture 요소 다양한 뷰포트 크기로 로드되는 다양한 버전의 사진을 보려면 브라우저 크기를 조정합니다. 브라우저는 미디어 쿼리가 사용자의 현재 뷰포트 너비와 일치하는 첫 번째 소스 요소를 찾습니다, 그리고 srcset 특성에 지정된 이미지를 .. 2023. 5. 2. HTML 배경이미지(Background Images) 배경 이미지는 거의 모든 HTML 요소에 대해 지정할 수 있다. HTML 요소에서 배경이미지 속성 HTML 요소에 배경 이미지를 추가하려면, HTML style 속성과 CSS background-image 속성을 사용한다: 배경이미지 a p 요소에 대한 배경이미지: 배경 이미지를 지정할 수 있습니다 표시되는 모든 HTML 요소에 대해. 이 예에서는 배경 이미지 요소에 대해 지정되었습니다. 기본적으로 background-image 방향으로 반복됩니다 요소보다 작은 경우 지정된 위치에 있습니다. 크기를 조정해 보십시오 브라우저 창에서 어떻게 하는지 확인합니다 배경 이미지가 동작합니다.. 배경이미지 a p 요소에 대한 배경이미지: 배경 이미지를 지정할 수 있습니다 표시되는 모든 HTML 요소에 대해. 이 예에.. 2023. 5. 1. HTML 이미지 맵(Image Maps) HTML 이미지 맵을 사용하여 이미지에 클릭 가능한 영역을 만들 수 있다. 이미지 맵 HTML 태그는 이미지 맵을 정의한다. 이미지 맵은 클릭 가능한 영역이 있는 이미지이다. 영역은 하나 이상의 태그로 정의한다. 아래 이미지에서 컴퓨터, 전화기 또는 커피 잔을 클릭한다: 이미지 맵 새 페이지로 이동하여 항목에 대한 자세한 내용을 보려면 컴퓨터, 전화 또는 커피 잔을 클릭하십시오: 컴퓨터 이미지를 클릭하면 아래 페이지로 이동한다. 스마트폰 이미지를 클릭하면 아래 페이지로 이동한다. 커피 이미지를 클릭하면 아래 페이지로 이동한다. 어떻게 작동할까요? 이미지 맵 뒤에 있는 개념은 클릭하는 이미지의 위치에 따라 다른 작업을 수행할 수 있어야 한다는 것이다. 이미지 맵을 만들려면 이미지와 클릭 가능한 영역을 설명.. 2023. 4. 30. 이전 1 ··· 11 12 13 14 15 16 17 ··· 19 다음
