실습 예시 # 실습 조건 사진 속 빨간 영역의 이메일 만들어 보는 HTML 실습을 진행 위의 회원가입 화면을 참고하여 CSS, JavaScript를 사용하지 않기 (하지만 이메일 외의 부분과 CSS가 없으면 가독성이 안 좋아보여서 공부할 겸 사용하였다.) 회원가입 형식 폼 실습 코드 - join.html 기본정보 표시 항목은 필수 입력 항목입니다. 이름 아이디 6~16자까지 영문자(소문자), 숫자 사용 가능합니다. 비밀번호 6~16자까지 영문자(대소문자), 숫자 및 특수문자 사용 가능합니다. 3자리 연속 또는 같은 문자, 아이디는 사용하실 수 없습니다. 비밀번호 확인 비밀번호가 일치합니다. 생년월일/성별 남 여 이메일 @ 메일주소입력 naver.com daum.net nate.com kakao.com y..

Style Link - 링크는 CSS 속성(예 : color : font-family, background 등)을 사용하여 스타일을 지정할 수 있다. - Link에 text-decoration(구분선), background-color(배경색)을 지정할 수 있다. - 링크 상태는 다음과 같다. a:link - 방문하지 않은 정상적인 링크 a:visited - 사용자가 방문한 링크 a:hover - 사용자가 마우스를 위에 올려놓았을 때의 링크 a:active - 클릭하는 순간의 링크 [주의사항 1] a:hover는 반드시 a:link 및 a:visited 뒤에 와야 한다. [주의사항 2] a:active는 반드시 a:hover 뒤에 와야 한다. /* unvisited link */ a:link { color..

CSS Box Model CSS에서 디자인과 레이아웃을 말할 때 사용하는 용어 Box Model은 기본적으로 모든 HTML 요소를 둘러싸는 상자이다. 내용, 패딩, 테두리 및 여백으로 구성. Content : 텍스트와 이미지가 표시되는 상자의 내용 Padding : 콘텐츠 주변 영역을 지운다. Border : Padding과 Content를 둘러싸는 테두리 Margin : 테두리 외부 영역을 지운다. div { width: 300px; border: 15px solid green; padding: 50px; margin: 20px; } 요소의 Width(너비)와 Height(높이) CS 사용하여 요소의 Width와 Height 속성을 설정할 때 Content 영역의 Width와 Height만 설정하면 된..