[CSS3] 자주 사용하는 선택자 정리 [selector : 태그, 클래스, id, 그룹 등]
·
◎ HTML5+CSS3/CSS3🎨
- 자주 사용하는 선택자 정리 1. 전체 선택자(universal selector) 모든 요소에 적용. 문서의 여백이나 글꼴 크기 등 기본 스타일을 초기화할 때 사용한다. → 전체 선택자로는 *를 사용한다. * { 속성: 속성 값; ... } 2. 태그 선택자(tag selector) 특정 태그가 쓰인 모든 요소에 스타일을 적용한다. /* 태그 { 스타일 } */ p { font-size:12px; /* 글자 크기 */ font-family:돋움; /* 글꼴 */ } 3. 클래스 선택자(class selector) 특정 부분에만 스타일을 적용할 때 사용 → 적용하려는 태그에 클래스를 붙여줘야 한다. /* .클래스명 { 스타일 } */ .bluetext { color:blue; /* 글자 색 */ } 4...
[CSS3] 스타일 형식과 스타일 시트 [내부 스타일 시트, 외부 스타일 시트, 인라인 스타일]
·
◎ HTML5+CSS3/CSS3🎨
- 스타일 형식과 스타일 시트 1. 스타일 형식 스타일은 맨 앞에 선택자를 지정하고, 중괄호({,}) 안에 세미콜론(;)으로 구분한다. /* 선택자 { 스타일 속성:속성 값; } */ p { text-align:center; } /* 텍스트 단락을 중앙에 정렬 */ h2 { font-size:20px; color:orange; } /* 2단계 제목의 글자 크기 20px, 글자 색상 주황색 */ 2. 스타일 시트 스타일은 위치에 따라 내부, 외부, 인라인으로 나눠진다. - 내부 스타일 시트 웹 문서 안에서 사용할 스타일을 정리한 것을 '내부 스타일 시트'라고 한다. → 상단 - 외부 스타일 시트 외부에 .css 파일을 따로 만들어 가져오는 것을 '외부 스타일 시트'라고 한다. → 여러 개의 웹 문서에 공통..
[일상] 7일 간의 스터디, Do it! 공부단 완독 인증!📝 [Do it! HTML5+CSS3 웹표준의 정석(전면 개정 2판)]
·
◐ 기타/개발자의 일상🎈
- 7일 간의 스터디, Do it! 공부단 완독 인증! 이지스 퍼블리싱 카페에 Do it! 공부단이라는 게 있어 참여하였다. (이전 22년 하반기 공부 계획에서 언급했던 그 공부단 이벤트가 맞다.) 공부하기로 마음 먹은 책은 'Do it! HTML5+CSS3 웹표준의 정석(전면 개정 2판)' HTML 3일, CSS 4일로 총 7일 간 공부기간을 잡았다. - Do it! HTML5+CS3 웹 표준의 정석 스터디 신청📝 Do it! 스터디룸 : 네이버 카페 Do it!, 된다 시리즈 책으로 함께 공부하고 서로 돕는 사람들을 만나 보세요. python, C, java, Android cafe.naver.com 1월 7일부터 13일까지 7일 간 스터디를 진행하였고, 매일매일 게시글을 업로드 하여 스터디를 인증하..
[HTML5] 블록 태그(block tag)와 인라인 태그(inline tag) [<h1>, <p>, <span> 등 텍스트 관련 태그들]
·
◎ HTML5+CSS3/HTML5📝
- 블록 태그(block tag)와 인라인 태그(inline tag) 1. 블록 태그(block tag) 블록 태그는 태그가 선택한 글자에만 적용되는 것이 아니라 텍스트가 포함된 블록 전체에 적용된다. - ~ 태그 태그는 제목 텍스트로, 일반 텍스트보다 굵고 진하게 표시된다. → 제목을 뜻하는 heading의 줄임말이며, 1부터 6까지 있다. HTML 삽입 미리보기할 수 없는 소스 안녕하세요! 안녕하세요! 안녕하세요! 안녕하세요! 안녕하세요! 안녕하세요! - 태그 태그는 텍스트를 표시할 때 가장 많이 사용하는 태그이다. → paragraph의 줄임말. 태그는 줄바꿈 없이 텍스트를 한 줄로 표시한다. HTML 삽입 미리보기할 수 없는 소스 단락입니다 만나서 반갑습니다 - 태그, 태그 태그는 줄 바꿈, 태그..
[꿀팁] CSS selector 연습 사이트 [CSS 선택자 게임, CSS Diner]
·
◐ 기타/알아두면 좋은 팁(tip)✨
- CSS 선택자 게임, CSS Diner CSS Diner A fun game to help you learn and practice CSS selectors. flukeout.github.io