공부방

이어서 선택자의 종류를 계속 알아보자 6. 링크 선택자. (가상 선택자) 태그를 사용할 경우에 이 링크를 클릭하거나, 커서를 올리는 등의 이벤트 마다 스타일을 다르게 지정할 수 있는데 이 때 설정하는 선택자들이다. :link - 기본값. 링크 상태를 나타냄 :visited - 방문한 곳을 구별할 수 있음 :hover - 커서를 올렸을 때 :active - 클릭했을 때 (클릭시부터 떼는 순간까지) :forcus - 클릭했을 때 (클릭을 떼도 남아있음) Nothing W3C h1 a{ text-decoration: none; } h1 a:visited{ color: seagreen; } h1 a:hover{ background-color: sienna; } h1 a:active{ color: yellow; ..

CSS 스타일에서 선택자에 대해 알아보도록 하자 1. 전체선택자. *{ margin : 0; padding : 0; } 전체 스타일을 적용시키는 항목이다. 일반적으로 margin과 padding 을 0으로 설정한다. 2. 후손 및 자식선택자 - 후손 : 공백으로 구분하며 하위의 모든 태그를 선택 - 자식 : 꺽쇠(>) 로 구분하며 하위중 자식 태그만 선택. ... ... Lorem Ipsum1 Lorem Ipsum2 Navigation Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem Ipsum2 Navigation Navigation2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lo..

위와같은 회원가입을 위한 페이지를 만들어 보도록 하자. 먼저 태그를 이용하여 전체 내용이 들어갈 블록을 지정한다. 제목인 회원가입은 태그를 이용해서 만들 수 있다 그리고 나서 입력한 정보들을 회원가입 버튼을 통해 전송해야하므로 태그를 만든다. 여기서 aaa.html은 임시로 만들어 놓은 것으로 실제 사용할 때에는 보낼 페이지 url을 넣어 주면 된다. method 속성의 키워드는 get방식과 post방식 2가지가 있는데 get방식을 사용하면 보내는 내용을 url에 표시하게 된다. 태그 안의 태그는 내용들을 꾸밀 css스타일을 적용시키는 태그이다. 태그를 만들고 나면 '필수입력정보' 와 '선택입력정보' 를 입력하기 위한 블록을 따로 지정한다. 여러 방식이 있겠지만 여기서는 태그를 이용하여 2개의 블록을 지..

html 태그에서 또는 태그를 사용하면 박스를 만들 수 있다. 속성으로는 margin : 바깥쪽여백 border : 테두리 padding : 안쪽여백 width, height : 콘텐츠 영역 border : 선 두께, 선 모양, 선 색상 - none : 기본값 선없음 - solid : 실선 - dotted : 점선 - deshed : 바느질선 - double : 이중선(최소3px) box-sizing box-sizing 속성은 다음 키워드 중 하나를 가진다. content-box는 기본 CSS 박스 크기 결정법을 사용한다. 요소의 너비를 100 픽셀로 설정하면 콘텐츠 영역이 100 픽셀 너비를 가지고, 테두리와 안쪽 여백은 이에 더해진다. border-box는 테두리와 안쪽 여백의 크기도 요소의 크기로 ..

HTML의 각 태그에 스타일을 적용하는 방법에 대해 알아보자. 1. 각 태그에 직접 style 속성 부여하여 스타일 적용. 2. head 태그 안에 style 태그를 미리 설정 3. css파일로 style 만든 후 링크로 연결 4. sytle 태그안에 # 또는 .으로 속성 만든 후 class/ id 속성으로 불러오기 1. 위의 태그처럼 직접 style을 설정하면 된다. 2. 위의 태그를 태그 안에 추가하면 된다. 3. css파일을 새로 만든후 css파일 내에서 스타일을 지정해 둔 뒤, 예시 2의 태그를 이용하여 이 파일을 불러온다. 4.style 태그 안에 . 또는 #으로 자신이 원하는 스타일 모양을 설정해 둔다. 그 후 스타일을 지정할 태그 안에 class 또는 id로 불러오면 된다. # - id : ..