목록2023/12/02 (2)
Minwoo Dev.
웹 사이트 클론 코딩을 공부하면서 웹페이지의 신기한 문법을 발견했다. sytle 시트에 ::before, ::after 이라고 적혀있는 것을 확인했는데, 다른 CSS 코드와는 조금 다른 모습이었기 때문에 궁금해서 알아보았다. 가상 요소(Pseudo-elements) CSS에서 기본적으로 스타일을 적용하면 선택ㅋ한 요소에 대하여 스타일을 적용한다. 따라서 그 모든 요소의 스타일을 변경하는 것이다. 하지만 가상 요소(Pseudo-elements)는 선택한 요소의 일부분에만 스타일을 적용할 수 있다. 가상 요소의 종류 ::before 요소의 시작부분에 콘텐츠를 추가한다. ::after 요소의 끝부분에 콘텐츠를 추가한다. ::first-line 요소의 텍스트에서 첫 줄에 스타일을 적용한다. ::first-let..
웹 개발을 하려면 HTML과 CSS는 뗄래야 뗄 수 없는 끈끈한 관계라는 것을 알 것이다. 개발은 직접 무언가를 만들어보면서 공부하는 것이 제일 좋기 때문에, CSS를 깊게 들여다보지 않고 필요한 만큼만 간단하게 설명하려고 한다. CSS의 ruleset css의 코드들은 위와 같은 ruleset들으로 이루어져 있다. p는 selector(선택자)라고 하며, h1, h2, p 등등 여러가지 항목을 바꿔적어주면 그 항목에 대하여 설정할 수 있다. color 과 text-align 은 Property(속성)으로, 선택자의 속성을 바꿀 때 사용한다. Value(속성 값)은 선택자의 값을 원하는 값으로 바꿀 때 사용한다. 위와 같은 형식은 기본이므로 생략하면 안된다. 중괄호({}), 콜론(:), 세미콜론(;)의 ..