본문 바로가기

title4

13. Haed - 파비콘(favicon), 타이틀(title) 안녕하세요. 콤퓨타 학원에 원장을 하고 있는 이프로입니다. 헤헴 ^^ 네이버에 들어간 후 브라우저 탭 헤더를 보시면 NAVER라는 텍스트와 그 옆에 아이콘 이미지가 보이실거에요 아이콘을 파비콘(favicon)이라고 부르고 NAVER 텍스트 부분은 타이틀(title)이라고 불러요. 한번 간단한게 둘어볼께요. 파비콘(favicon) 적용 link 태그를 이용해서 type속성에 image/x-icon 속성을 넣으면 파비콘 설정을 할 수 있게 되는데요. href속성에 이미지 경로를 넣어주면 해당 이미지가 파이콘 위치에 표시되는걸 확인 할수 있어요. href에 넣을수 있는 종류는 icon파일부터 png, jpg등등 거희 대부분의 이미지 파일을 사용 할 수 있어요. 꼭 icon파일이 아니여도 가능하니 일반 이미지로.. 2024. 1. 2.
08. Body - 이미지 안녕하세요. 콤퓨타 학원에 원장을 하고 있는 이프로입니다. 헤헴 ^^ 홈페이지를 만들때 이미지를 빼놓을 수 없조. 이번 강좌에서는 html로 이미지를 불러와 처리하는 방법에 대해서 이야기해보겠습니다. img 태그 문법 img 태그는 이미지를 표현할때 사용하는 태그에요. src 속성은 이미지가 있는 위치를 말합니다. a태그에 href와 비슷하게 실제 파일의 위치를 설정해주면 됩니다. alt 속성은 대체 텍스트라고 하는 부분인데요. 이부분은 눈이 보이시지 않는 맹인 분들을 위한 기능이라고 볼수 있는데요. 맹인 분들은 이미지를 볼수 없기때문에 텍스트를 읽어주는 기능일 이용해서 홈페이지를 방문하여 소리로 어떤 홈페이지인지 알수 있다고 합니다. 이미지의 경우 이미지가 어떤 이미지인지를 alt에 적어 놓으면 그걸 .. 2024. 1. 2.
02. 개발 환경 안녕하세요. 콤퓨타 학원에 원장을 하고 있는 이프로입니다. 헤헴 ^^ html을 개발하기 위한 개발 환경을 만들어 볼거에요. html은 특별한 개발환경이 필요한건 아니에요. 그냥 간단히 메모장과 같은 아무 에디터를 이용해도 상관없어요. 하지만 전 좀 더 편하게 html를 코딩 할 수 있는 툴을 소개할려고 해요. 바로 Visual studio code라는 에디터에요. 자 그럼 그냥 메모장과 Visual studio code의 차이점을 간단하게 보여드릴께요. 이후 부터는 부르기 편하도록 VS Code라고 부를께요. 어떻신가요? 차이점이 느껴지시나요? vs code에서는 특정 단위로 색상이 다르게 보이시는 걸 느끼실건데요. 이걸 코드 하이라이팅이라고해요. 덕분에 코드의 영역별로 구분을하기 수월해지조. 단순히 .. 2023. 12. 29.
01. html 소개 안녕하세요. 콤퓨타 학원에 원장을 하고 있는 이프로입니다. 헤헴 ^^ html은 마크업 랭귀지라고 해서 프로그래밍 언어가 아니에요. 프로그래밍 영역에 해당하는 것을 처리 할 수 없지요. html은 브라우저 화면에 보여지는 단순한 외형들을 담당해요. 마치 건물을 지을때 골격같은 느낌이라고 할까요. 이거에서 조금더 이야기를 하자면 외형을 이쁘게 인테리어를 한다고하면 style과 css가 담당하게 될것이구요. 전등 스위치를 달아 켜고 끄기를 하려면 javascript가 그걸 담당하게 될거에요. 그럼 우선 html의 기본 구성 형태를 확인해보도록 해볼께요. * html 특징 한가지 참고할 것이 있는데요. html은 문법을 정확히 지키지 않아도 된다는 특징이 있어요 그렇다고 말도 안되게 내 마음대로 구성하면 브라.. 2023. 12. 29.