YoonStudyNote

선택자는 HTML의 특정한 요소를 선택하는 사인(sign)이다. 1. 태그로 찾기 선택자를 입력하는 부분에 적용하려는(찾으려는) 태그의 이름을 입력한다. h1{ color : red; } p{ color : blue; } 선택자를 작성하는곳에 아무런 기호 없이 우리가 알고 있는 태그의 이름만 작성하는것을 통해서 "태그들"을 찾을 수 있다. 하지만 문제는 예를들어 수많은 div가 있는데 우리가 원하는 특정 일부 div를 찾아내는데 무리가 있다. 2. 클래스로 찾기 좀 더 명확하게 원하는 요소를 찾기 위해서 '클래스 선택자'라는 것이 존재한다. .title{ color : red; } .main-text { color : blue; } "."은 클래스 선택자라고 한다. title이라는 태그를 찾는것이 아니라..

1. 태그에 직접 작성하기(인라인) 이방법은 HTML 태그에 직접 작성하기 때문에 선택자가 필요하지 않는다. 태그에 직접 작성1 단점으로는 우리가 직접 찾아서 값을 넣어줘야하는데 만약 넣어줘야하는 값이 많아지면 곤란해진다. 그래서 최대한 피해야한다. 그리고 수정하는데에도 굉장히 비효율적이다. 그렇다고헤서 이것 자체는 나쁜 방식은 아니다. 2.HTML에 포함하기(내장) --> embeded방식 CSS만 따로 작성하기 때문에 선택자가 필요하다. CSS코드가 HTML의 안에 포함되어 있다. (style태그는 head태그안에 설정을하는 속성이다.) HTML에 포함1 HTML에 포함2 HTML에 포함3 3. HTML 외부에서 불러오기 (link) 외부에서 문서를 가져오는 방식이다. CSS 코드를 완전히 분리할 수..

속성과 값은 글자색은 무엇, 너비는 얼마, 여백은 얼마 같은 스타일을 지정할 때 사용한다. div{ color : red; //글자색은 빨강 font-size : 20px; // 글자 크기는 20px width : 300px; // 가로 너비는 300px margin: 20px; // 바깥 여백은 20px padding : 10px 20px; //안쪽 여백은 위아래 px, 좌우 20px position : absolute; //위치는 부모 요소 기준. }

선택자는 HTML에 스타일(CSS)을 적용하기 위해서 HTML의 특정한 요소를 선택하는 사인(sign)이다. "빨간 글자색 (CSS, color : red;) 을 저기 제목 (HTML, 에 적용하겠어!)", "파랑 글자색(CSS, color:blue;)은 여기 본문(HTML, 에 적용하겠어!)"와 같이 적용할 스타일을 속성과 값으로 나타내고 적용할 대상(H1,P)을 선택자로 나타낸다. h1{ //선택자 color : red; } p{ //태그 color : blue; }

웹 표준 검사하기 우리가 작성한 HTML 문서가 표준에 부합하는지 테스트를 해볼 수 있습니다. W3C validator에 접속하여 작성한 HTML 문서를 업로드하고 테스트를 시작하세요! 기본적인 표준 여부를 판단할 수 있습니다. 특히 입문자라면 익숙해질 때까지는 자주 확인하는 것이 좋습니다. 위에서 라고 작성했을 때 나오는 결과입니다. HTML 문서를 작성하면서 지켜야하는 이러한 규칙들이 많이 있습니다. 테스트 통과가 웹 표준/웹 접근성의 준수 여부를 최종적으로 결정하진 않습니다. 이 테스트는 사실 기본 문법 검사에 가깝습니다. 또는 사이트(페이지) 주소로 검사할 수도 있습니다. 다음은 naver.com을 검사한 결과입니다.