전체 글
5주차
스터디 범위 자바스크립트로 무엇을 할까? HTML이나 CSS와 함께 사용해서 웹의 요소를 움직이거나 포토 갤러리를 펼처 놓은 것처럼 웹 사이트 UI부분에 많이 활용 과거 웹은 단순히 정보를 나열하고 검색했다면, 최근 웹은 사용자와 실시간으로 정보를 주고 받으며 마치 애플리케이션처럼 동작 웹 플랫폼을 중심으로 하는 서비스가 점점 늘어나면서 그만큼 웹 브라우저를 통한 상호 작용이 더욱 중요해짐 과거에는 서버에서 했던 일을 이제는 클라이언트에서도 할 수 있게 되었고, 클라이언트에서 처리해야 할 기능이 많아지면서 자바스크립트의 기능은 더욱 강력해짐 자바스크립트를 사용하는 방식 웹 브라우저에는 자바스크립트 소스를 읽고 처리하는 해석기(JavaScript Interpreter)가 존재 웹 문서 안에 외부 스크립..
[HTML+CSS+자바스크립트 웹표준의 정석] 회의록
Reference https://www.notion.so/c0ebb157d282494093cd90d7e3d55321?v=996e42667aa6449ebd387193611ab98c
텍스트를 스타일하는 방법
Definition CSS를 이용하여 텍스트의 스타일을 변경하는 것이 가능합니다. 아래와 같은 항목을 설정할 수 있습니다. font-family: 글꼴 font-size: 크기 font-style: 이탤리체 font-weight: 굵기 글꼴 변경 웹 문서에서 글꼴을 지정할때에는 한가지 글꼴을 선택하기도 하지만, 글꼴이 없을때를 대비하여 두번째, 세번째 글꼴까지 명시하는 것이 좋습니다. font-family: | [ , ] test heading 1 단락 정보 1 단락 정보 2 단락 정보 3 크기 변경 font-size를 이용하여 글짜 크기를 변경할 수 있습니다. font-size: | | | test heading 1 단락 정보 1 단락 정보 2 단락 정보 3 이탤릭체 설정 font-style을 사용하면..
CSS 선택자(Selector)
Definition 스타일 규칙은 태그뿐만 아니라 웹 문서 어떤 요소에도 적용 가능합니다. 선택자는 웹 문서에서 어느 부분에 스타일을 적용할 것인지 알려주는 것입니다. 선택자를 사용하는 방법은 미리 약속되어 있습니다. 전체 선택자 문서의 모든 요소에 스타일을 적용할 때 사용하는 선택자입니다. * { 속성:값; } 타입(Type) 선택자 특정 tag를 사용한 모든 요소에 style을 적용하는 것이 가능합니다. tag명 { 속성:값; } Type 선택자 test heading 1 단락 정보 1 단락 정보 2 단락 정보 3 클래스(Class) 선택자 다른 tag값을 가질지라도 특정 부분을 선택해서 스타일을 적용하고 싶다면, Class 선택자를 사용하면 됩니다. .Class명 { 속성:값; } Class 선택자..
Style을 적용하는 방법
Definition HTML문서에 body에 적용된 element에 Style을 적용하는 방법은 총 3가지가 존재합니다. 인라인 스타일 내부 스타일 시트 외부 스타일 시트 인라인 스타일 HTML tag에 속성 정보를 넣어서, 직접 Style을 변경하는 것이 가능합니다. heading 1 단락 정보 내부 스타일 시트 HTML 문서의 heading 1 단락 정보 외부 스타일 시트 HTML문서가 아닌 CSS파일을 HTML문서로 Loading 하여 Style을 적용하는 것이 가능합니다. /* style.css */ h1 { background-color:#456; color:#afe; } Style 적용 test heading 1 단락 정보