본문 바로가기

분류 전체보기208

[CSS] 기본 익히기 PART 4 Table table 태그에 border 속성을 활용해서 테두리를 그릴 수 있다. 영화 상영시간 개봉 블랙핑크 더 무비 100분 2021.08.04 개봉 정글 크루즈 127분 2021.07.28 개봉 보스 베이비2 107분 2021.07.28 개봉 더 수어사이드 스쿼드 132분 2021.08.04 개봉 블랙 위도우 134분 2021.07.07 개봉 방법-재차의 109분 2021.07.07 개봉 모가디슈 121분 2021.07.28 개봉 Box Model 모든 HTML 요소는 웹 페이지에서 일정 공간을 차지하는데 이러한 공간을 CSS에서는 Box Model 이라고 정의한다. Box Model 은 Content, Padding, Border, Margin 으로 구성되어 있다. Content - 텍스트나 이미.. 2024. 3. 13.
[CSS] 기본 익히기 PART 3 Font 관련 속성 font-family - 글꼴 종류 지정 font-size - 글자 크기 지정 font-style - 글자를 이텔릭체로 지정 font-weight - 글자 굵기 지정 font-variant - 대 소문자 변경시 사용 html { /* font-family: serif, monospace; */ font-family: 'Nanum Gothic', sans-serif; /* 웹 폰트 적용 */ font-size: 16px; } .title { font-size: 28px; color: #258a48; } .content { font-size: 18px; } .font-italic { font-style: italic; } .font-weight-bold { font-weight: bold.. 2024. 3. 13.
[CSS] 기본 익히기 PART 2 Selector(선택자) 기본 선택자 전체 선택자 - *를 사용하며 모든 요소를 선택할 때 사용한다.(초기화 할때 자주 사용한다.) /* 전체 선택자 */ * { margin: 0px; padding: 0px; } 타입 선택자 - 태그를 선택해서 적용한다. /* Type 선택자 */ h2 { color: green; } p { color: gray; font-weight: 400; text-align: center; } 클래스 선택자 - class명으로 스타일을 적용한다. /* Class 선택자 */ .red--text { color: red; } .blue--text { color: blue; } ID 선택자 - ID 속성에 맞는 요소를 선택해 스타일을 적용한다. ID는 고유해야하므로 겹쳐서는 안된다... 2024. 3. 13.
[CSS] 기본 익히기 PART 1 CSS의 구조 선택자 - 꾸미고 싶은 태그(요소) 속성명 - 스타일의 종류 속성값 - 스타일 CSS 적용방법 인라인 스타일 - Inline Style Sheet 태그 안에 스타일을 명시하는 방법 여러개의 스타일을 적용할 때는 ;(세미콜론)을 사용한다 실무에서 잘 사용하지 않지만 정말로 바뀌지 않는 스타일이 있을 때 사용한다. 제목 내부 스타일 - Internal Style Sheet 헬스 헬스장에서 운동한다 외부 스타일 - External Style Sheet 제일 많이 사용하는 방법 외부에 css 확장자를 만들어 사용한다. html 파일에 link 태그를 명시하고 href로 css의 경로를 불러와서 사용한다. 코딩 우리는 코딩을 배우고 있다 /* CSS 파일 코드 */ h1 { color: blue; .. 2024. 3. 13.