본문 바로가기

웹개발20

사용자의 상호작용을 위한 버튼을 만들자 HTML <button> 태그 BUTTON 태그란? 태그는 사용자가 클릭해서 이벤트를 발생시킬 수 있는 버튼을 만드는 태그입니다. 사용법 클릭하세요 button은 쌍으로 존재하는 태그입니다 사이에 text를 입력합니다 예시 See the Pen Untitled by 40's Programmer (@40sProgrammer) on CodePen. 간단하게 누를 수 있는 버튼을 만들었습니다. BUTTON 태그의 다양한 속성 태그는 3가지 주요 속성을 지닙니다. 사용법 2023. 5. 30.
HTML 리스트 생성 <ul> 태그 - 순서없이 마커로 목록 생성 UL 태그란? UL (Unordered List) 태그는 목록을 생성하는 도구입니다. 우리가 흔히 볼 수 있는 리스트 앞에 점이 찍힌 형태에요. 태그는 LI (List) 태그와 항상 함께 다닙니다. 사용법 List 1 List 2 List 3 태그를 엽니다. 앞으로 순서없는 리스트를 만들거라고 선언한거죠 다음 줄에 들여쓰기를 한 뒤 태그를 만듭니다. 원하는 만큼 만들면 됩니다. 태그 사이에 원하는 목록을 추가합니다. 태그를 써서 닫습니다. 예시 See the Pen UL by 40's Programmer (@40sProgrammer) on CodePen. UL 태그의 속성 원래 아래 속성들이 있었는데 HTML5부터는 사용하지 않는다고 하네요. 대신 CSS에서 조정한다고 합니다. type : 앞에 마커 형.. 2023. 5. 29.
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 주석 처리: 코드에 숨겨진 메시지를 알려주는 <!-- --> 태그 주석 처리 TAG란? HTML 주석처리는 개발자가 코드에 메모나 설명을 추가하는 기능입니다. 실행되지는 않지만 코멘트를 달아둘 수 있는 유용한 기능입니다. 사용법 태그는 단독 태그입니다 코멘트는 사이에 입력합니다 [TIP] VS CODE와 같은 개발도구 등에서 CTRL + / 를 누르면 바로 주석처리 됩니다. 코드작성 로그인 영역 결과확인 See the Pen Untitled by 40's Programmer (@40sProgrammer) on CodePen. 왜 주석처리를 해야 하나? 사람은 망각의 동물입니다. 때문에 본인이 짜 놓은 소스도 시간이 지나서 보면 생소합니다. 다른 사람의 소스는 오죽할까요? 다른 사람, 미래에 다른 사람처럼 행동할 나를 위해 코드에 대한 정보를 전달하기 위해서라도 주석은 .. 2023. 5. 28.