CSS 3

[CSS]3. 복합, 자식, 하위, 인접 형제, 일반 형제 선택자

목차 복합 선택자 자식 선택자 하위 선택자 인접 형제 선택자 일반 형제 선택자 1. 복합 선택자 지난 시간에는 전체, 태그, 클래스, id 선택자에 대해서 알아보았다. 또한 전체, 태그, 클래스, id 선택자들의 우선순위에 대해서도 알아보았다. 만약 아직 해당 선택자들을 아직 모른다면 "[CSS]2. 기본 문법 - 선택자의 종류와 우선순위" 글을 읽고 오길 바란다. 복합 선택자는 말 그대로 2개 이상의 선택자를 모두 만족하는 선택 자이다. 아래 예시를 보면 쉽게 이해가 될 것이다. 아래 코드를 설명해 보자면, p태그이면서 ong 클래스를 가리키고 있다. 복합 선택자를 사용하면서 주의해야 하는 점은 선택자를 붙여주어야 한다는 것이다. 이것이 의미하는 것이 무엇이냐면, 아래 예제에서 p. ong이 아닌 p...

Html, Css 2022.02.19

[CSS]2. 기본 문법 - 선택자의 종류와 우선순위

목차 기본 문법 전체 선택자 태그 선택자 클래스 선택자 id 선택자 선택자의 우선순위 1. 기본 문법 CSS의 기본적인 문법은 다음과 같다. HTML강의를 들었던 분들은 h1태그가 무엇을 의미하는지 알 것이다. h1태그를 모르는 사람들을 위해 이 태그가 무엇인지 간단하게 설명하고 가자면, h1 태그는 주로 제목을 나타낼 때 쓰인다. 아래 코드를 분석해보자면 중괄호 앞의 h1은 선택자, 중괄호의 시작부터 끝부분 까지를 선언 부라고 한다. color와 font-size와 같이 :의 왼쪽 부분에 위치하는 것은 속성 명, :의 우측에 위치한 것은 속성 값이라고 하며 이 두 개를 하나의 속성이라고 부른다. 또한 속성끼리는 아래와 같이 ;로 구분해줘야 한다. h1{color: yellow; font-size: 5p..

Html, Css 2022.01.31

[CSS]1. CSS란 무엇인가?-CSS의 필요성

목차 CSS란 무엇인가 CSS의 필요성 이 강의에서 다룰 내용 1. CSS란 무엇인가? CSS는 캐스케이딩 스타일 시트(Cascading Style Sheets)로, CSS의 사전적 정의는 마크업 언어가 실제 표시되는 방법을 기술하는 스타일 언어(style sheet language)이다. 이를 쉽게 설명하자면 우리가 잘 알고있는 마크업 언어중에 한 종류인 HTML을 예로 들어보자면, HTML을 꾸며준다라고 생각하면 편하다. 2. CSS의 필요성 위에서 말했듯이 CSS는 HTML을 꾸며주는 역할을 한다. 꾸며주는 역할을 한다고 하면 굳이 필요할까? 라는 의문을 가지고 있는 사람도 있을것이다. CSS의 필요성을 위해서 내가 만든 사이트를 비교하면서 보여주겠다. 왼쪽은 내가 HTML, CSS 그리고 간단한 ..

Html, Css 2022.01.30
반응형