HTML,CSS,JavaScript 썸네일형 리스트형 [HTML] 특수문자 아직도 헷갈린다고?? ""&"를 쓰면 이상한 기호로 바뀐다고요?HTML 특수문자, 그거 무시하다가진짜 필요한 순간에 손 놓게 됩니다. 기호 하나 제대로 출력 못 하는 사이트,생각보다 많습니다. 오늘은 조용히 숨어 있지만웹을 지탱하는 작고 중요한 조각들. HTML 특수문자 이야기입니다. 오늘 배울 건 HTML 특수문자 (Entities)입니다. 1 2 위 코드는 HTML에서 흔히 쓰이는 기호 문제를 잘 보여줍니다. 는 less than(>는 greater than(>)을 뜻하고, &는 앰퍼샌드(&) 자체를 표시할 때 사용합니다. 그냥 같은 기호를 그대로 쓰면 브라우저가 태그로 착각해 에러가 나기 때문에 꼭 이스케이프 문자를 써야 해요.저작권 기호: © 2025 All rights reserved. 이건 저작권 표.. 더보기 [HTML] Form 미츠따~ 이 태그 몰라도 괜찮다고요? 절대 아니죠. 웹에서 사용자와 '진짜로' 소통하고 싶다면, 이 태그는 빠질 수 없습니다. 당신의 사이트에 정보를 입력하고, 전송하고, 반응을 주는 모든 순간.그 중심에 있는 건 바로 form입니다. 겉으론 평범해 보여도, 안을 들여다보면 꽤 많은 걸 품고 있는 태그죠. 오늘 배울 태그는 입니다. 이름: 제출하기 가장 기본적인 form 구조입니다.태그는 사용자의 데이터를 서버로 보내는 역할을 합니다.Action은 데이터를 보낼 URL, method는 전송 방식(post 또는 get)을 지정하죠.이건 웹이 웹 다울 수 있게 해주는 아주 본질적인 기능입니다. 가입하기 기본 form은 서버로 전송되지만, 프론트엔드에서 처리하고 싶을 땐 onsubmit 이벤트로 .. 더보기 [HTML] BUTTON 똑바로 써봤어?? 이 버튼 하나 때문에 전환율이 두 배 올랐다고?그런데 아직도 button 태그를 모르고 쓰고 있다고요?우리가 매일 누르는 그 버튼, 그냥 눌린다고 끝이 아닙니다.HTML에서의 button 태그는 단순한 트리거 이상의 의미를 가집니다.오늘은 겉보다 속이 중요한 태그에 대해 조금 더 깊이 있게 이야기해보려 합니다. 오늘 배울 태그는 입니다. 클릭하세요 가장 기본적인 버튼 형태입니다. button 태그는 사용자 액션을 받을 수 있는 대표적인 요소로, 웹에서 클릭 이벤트를 전달하는 핵심 인터페이스죠. 기본적으로 폼 안에서 사용되면 submit 역할을 자동으로 가지지만, 그 외에도 다양한 동작을 자유롭게 지정할 수 있습니다. 인사하기 👋 이 버튼은 onclick 이벤트를 활용해 사용자가 클릭했을 때 간단.. 더보기 [HTML] div태그 기본인건 알지?? 당신의 HTML 구조, 지금 괜찮다고 생각하시나요?겉은 괜찮아 보여도 속이 텅 비었을 수 있습니다.웹 페이지의 진짜 틀을 만드는 태그,바로 입니다.무조건 남용하라는 건 아니지만,제대로 알고 쓰면 HTML 구조가 기가 막히게 정리됩니다. 오늘 배울 태그는입니다. 안녕하세요! 이건 가장 단순한 div 태그 사용 예시입니다. 아무런 스타일 없이 내용만 감싼 모습이죠. div 는 기본적으로 블록 레벨 요소이기 때문에 한 줄 전체를 차지하며 쌓여갑니다. 보통 의미 없는 그룹핑용으로 쓰이지만, 의미가 없다고 중요하지 않은 건 아니에요. 나만의 카드 컴포넌트 ✨ div에 스타일을 입혀주면 그 자체로 박스 형태가 됩니다. 위 코드는 배경색, 패딩, 둥근 모서리를 통해 시각적인 카드 UI처럼 연출했죠. 실제.. 더보기 [HTML] li 지금까지 제대로 썼어?? 이 태그 없으면 리스트는 못 만듭니다.단언컨대, 를 빼고 목록을 만든다는 건 불가능해요.안녕하세요!오늘도 HTML을 차곡차곡 배워가는 시간입니다.그동안 웹사이트에서 ‘목록’이라는 걸 수도 없이 보셨을 거예요.할 일 리스트, 메뉴 목록, 쇼핑 카테고리…이런 걸 어떻게 만들 수 있는지 궁금하셨죠?오늘은 그 핵심인 태그를 제대로 알려드릴게요.단순하지만 없어선 안 되는 태그,같이 알아보겠습니다.오늘 배울 태그는 목록의 ‘한 줄’을 담당하는 태그입니다. HTML 배우기 CSS 익히기 JavaScript 시작하기 태그는 리스트에서 각 항목 하나를 표현할 때 사용합니다.위 코드에서는 이라는 ‘순서 없는 리스트(ul)’ 안에 세 개가 들어가 있죠.각각은 ‘HTML 배우기’, ‘CSS 익히기’.. 더보기 [HTML] a 태그 제대로 알고 사용하자! 이 링크 태그 없으면웹사이트 절반은 기능을 잃습니다. 진짜예요. 😮안녕하세요!초보자를 위한 감성 HTML 수업에 오신 걸진심으로 환영합니다 ☕우리는 오늘,웹페이지의 '길'을 만들어주는아주 특별한 태그 하나를 만나게 될 거예요. 어디론가 연결되고 싶었던 HTML의 마음을들어줄 수 있는 태그랍니다. 💌그럼, 오늘의 태그로 함께 떠나볼까요? 오늘의 주제는 바로 태그입니다. 하이퍼링크의 모든 것 ✨ 아래 텍스트를 클릭해 보세요. 네이버로 이동 위 코드는 HTML에서 가장 기본적인 링크 구조를 보여줍니다. 는 Anchor, 즉 ‘닻’을 의미하는 태그인데요, 이 태그 덕분에 한 페이지에서 다른 페이지로 혹은 같은 페이지의 특정 지점으로 이동할 수 있어요. 중요한 속성은 바로 href입니다. ‘Hyperte.. 더보기 [HTML] Box 박스 모델 활용 CSS 안녕하세요. 오늘은 Box 박스 모델에 대해 알려드리겠습니다. 모든 글자, 칸, 이미지 등등 모든 것에는 테두리가 다 존재합니다. F12를 누르고 Elements를 누르면 현재 페이지에서 이뤄지는 코드를 다 볼 수 있습니다. 거기서 아무거나 클릭해보고 낮보면 이런 모양을 보실 수 있습니다. 현재 그 태그에 margin, border, padding 크기를 다 수정할 수 있습니다. 지금 부캐는 열일중 margin, padding은 여백이므로 색상이 없습니다. border에는 색상을 넣을 수 있습니다. .box { margin: 15px 15px 15px 15px; 상단오른하단왼쪽 } margin : 15px 15px; 상하좌우 margin : 15px; 모든면 } .box { padding : 15px 1.. 더보기 [HTML] input 활용하기 안녕하세요. 오늘은 input에 대해 알려드리겠습니다. 어떤 곳에 어떻게 사용하느냐에 따라 정말 다양하게 활용 할 수 있는 수식입니다. 기본적인 구성!! 버튼 체크박스 색상선택 년 월 일 선택 년 월 일 시 분 초 선택 메일 주소 파일 첨부하기 숨기기 이미지 파일 년 월 숫자박스 비밀번호 ****** 라디오 (체크표시) ex) 동영상 볼륨 조절 초기화 검색 제출버튼 연락처 입력 시 분 초 url주소 주 쓰기 나름입니다. 보편적으로 text, date, submit, button, number, hidden을 많이 사용하는 것 같습니다. 가장 많이 사용하는 text로 예시를 하나 만들어보겠습니다. value 값으로 미리 해두면 바로 홍길동이라고 나오게 되어있습니다. name은 input의 용도를 표현 할 .. 더보기 이전 1 2 3 4 다음 > 오늘의 코인 운세 보기 <
