본문 바로가기

HTML37

HTML의 핵심 요소, a 태그: 링크의 세계로의 초대 A 태그란? 인터넷의 힘은 연결(링크)입니다. 세상의 모든 웹페이지는 다른 웹페이지와 연결되어 있죠. 이 때 a 태그는 링크를 생성하는 핵심 요소에요. a 태그는 사용자가 다른 페이지로 이동하거나 페이지 내의 특정 위치로 스크롤할 수 있도록 해줍니다. 사용법 이 링크를 클릭하세요! a(anchor)는 태그, href 태그 내 속성입니다 href(Hypertext Reference)에는 링크가 연결되는 대상 URL을 지정합니다 a 태그를 닫은 뒤 링크를 포함한 텍스트를 입력합니다 a 태그를 닫습니다 예시 저는 네이버로 이동하는 링크를 만들었습니다. See the Pen A by 40's Programmer (@40sProgrammer) on CodePen. 같은 페이지 내에서 특정 위치로 이동 a 태그는 .. 2023. 5. 29.
이미지 표현을 위한 HTML img 태그 IMG 태그란? 웹페이지에 이미지(image)를 넣을 수 있는 태그입니다. IMG 태그는 self-closing 태그여서 닫는 태그가 필요하지 않습니다. 대부분의 HTML 태그가 쌍으로 존재하지만, 일부 태그는 단독으로 존재합니다. 이미지가 없는 웹사이트를 찾기가 힘들 정도로 HTML에서 이미지 태그는 필수인 것 같아요. 사용법 img는 태그, src,alt는 태그 내 속성입니다 src 속성(source)에는 이미지 파일이 있는 위치를 입력합니다 alt 속성에는 이미지가 보이지 않을 때 나올 텍스트를 입력합니다 alt 속성은 꼭 입력하지 않아도 이미지 파일을 보이는데 문제는 없어요. 하지만 검색엔진이 웹페이지의 완성도, SEO 기준을 볼 때 중요하기 때문에 넣어주면 좋습니다. 코드 작성 저는 wikipe.. 2023. 5. 28.
HTML 주석 처리: 코드에 숨겨진 메시지를 알려주는 <!-- --> 태그 주석 처리 TAG란? HTML 주석처리는 개발자가 코드에 메모나 설명을 추가하는 기능입니다. 실행되지는 않지만 코멘트를 달아둘 수 있는 유용한 기능입니다. 사용법 태그는 단독 태그입니다 코멘트는 사이에 입력합니다 [TIP] VS CODE와 같은 개발도구 등에서 CTRL + / 를 누르면 바로 주석처리 됩니다. 코드작성 로그인 영역 결과확인 See the Pen Untitled by 40's Programmer (@40sProgrammer) on CodePen. 왜 주석처리를 해야 하나? 사람은 망각의 동물입니다. 때문에 본인이 짜 놓은 소스도 시간이 지나서 보면 생소합니다. 다른 사람의 소스는 오죽할까요? 다른 사람, 미래에 다른 사람처럼 행동할 나를 위해 코드에 대한 정보를 전달하기 위해서라도 주석은 .. 2023. 5. 28.
HTML P 태그, 글을 구조화하고 가독성을 높이는 도구 P 태그란? 단락(paragraph)을 정의하는 데 사용됩니다. 태그는 텍스트를 단락으로 구분하며, 글을 작성할 때 각각의 문장과 문단은 구분하여 표시하는데 필요합니다, 사용법 TEXT P 태그 사이에 원하는 텍스트 작성하기 코드 작성 여기에 내용을 작성합니다. 결과 확인 왜 P 태그를 써야 하나? 태그를 사용하여 단락을 정의하면 다음과 같은 이점이 있습니다 텍스트의 구조를 검색 엔진이 내용을 이해하고 색인화하는 데 도움을 줍니다. 단락의 전후에 여백이 적용되어 가독성을 향상시킵니다. 태그는 글 작성에 필요요소입니다. See the Pen P TAG by 40's Programmer (@40sProgrammer) on CodePen. 위의 화면은 텍스트를 P태그로 감싼 경우와 감싸지 않은 경우인데요. 보.. 2023. 5. 28.

티스토리툴바