본문 바로가기

CSS60

css 전체 셀렉터에 대하여 알아보기 css 전체 셀렉터에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 전체 셀렉터에 대해 알아보도록 하겠습니다. 우리가 웹 페이지를 작성을 하다 보면 페이지 전역적으로 무언가를 적용시켜야 하는 경우가 있습니다. 그럴 때 우리는 전체 셀렉터를 사용합니다. 그래서 이번 포스팅에서는 전체 셀렉터를 어떤 식으로 사용을 하는지 한 번 알아보도록 하겠습니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 전체 셀렉터 전체 셀렉터는 html 페이지 전역적으로 적용되는 셀렉터를 말합니다. 때로는 우리가 css를 전체적으로 균일하게 적용을 시켜야 하는 경우가 생기는데, 그럴 경우에 전체 셀렉터를 이용합니다. 전체 셀렉터를 쓸 때는 에스터리스크(*)를 사용하며, 이때 쓰는 '*'을 와일드카드 문자라고 합니다. 이런 식으로 .. 2023. 3. 13.
css id 셀렉터에 대하여 알아보기 css id 셀렉터에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 id 셀렉터에 대하여 알아보도록 하겠습니다. id 속성은 class 속성 만큼이나 자주 쓰이는 속성입니다. 그리고 html에서 기능적인 부분을 구현할 때 자주 쓰이는 속성이기 때문에 매우 중요합니다. 이번 시간에는 이 id를 이용하여 css를 적용시키는 방법에 대하여 알아보도록 하겠습니다. 그럼 지금부터 시작하도록 하겠습니다. 1. id 셀렉터 id 셀렉터는 class 속성과 같은 기능을 하기는 하지만, 앞에 붙이는 것이 다릅니다. 셀렉터를 작성할 때 '#'을 붙여서 작성을 합니다. id 셀렉터는 class 셀렉터를 쓰는 것과 같이 '#' 뒤에 본인이 명명하고자 하는 id명을 적고 쓰시면 됩니다. 이에 대한 간단한 코드도 준비를 해봤.. 2023. 3. 13.
css 클래스 셀렉터에 대하여 알아보기 css 클래스 셀렉터에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 클래스 셀렉터에 대하여 알아보도록 하겠습니다. html에서 클래스는 id와 함께 기능적인 부분을 구현할 때 자주 쓰이는 기능입니다. 이번 시간에는 그러한 기능을 가진 클래스를 이용하여 스타일을 적용하는 방법에 대해 알아볼 것입니다. 그럼 시작하도록 하겠습니다. 1. class 셀렉터 : '.' 이용 class 셀렉터는 html 태그에서 사용하는 class 속성과 연결을 합니다. 그래서 class 속성을 사용해서만 연결을 지을 수 있다는 특징이 있습니다. 그리고 class 속성 셀렉터를 작성을 할 때는 본인이 작성하고자 하는 클래스의 이름 앞에 '.'을 붙여서 짓습니다. 그럼 간단한 예제와 함께 같이 봅시다. Web Programmi.. 2023. 3. 13.
css 태그 이름 셀렉터에 대하여 알아보기 css 태그 이름 셀렉터에 대하여 알아보기 네 안녕하세요, 이번 포스팅에서는 태그 이름 셀렉터에 대하여 알아보도록 하겠습니다. 셀렉터는 html을 꾸밀 때 사용하는 기능인데, 저번에 했던 포스팅에서 스타일 시트를 작성하면서 봤던 것들이 셀렉터 입니다. 그래서 이번 시간에는 그러한 셀렉터 중 하나인 태그 이름 셀렉터에 대하여 알아보려 합니다. 그럼 지금부터 시작하도록 하겠습니다. 1. 태그 이름 셀렉터 태그 이름 셀렉터는 우리가 쓰는 html 태그의 이름이 그대로 셀렉터로 쓰이는 경우를 이야기합니다. 이를테면 h3, img, label 등 우리가 사용하는 html 태그라면 전부 다 쓸 수 있습니다. 그러면 이러한 예시를 하나 간단히 보여드리도록 하겠습니다. Web Programming 2학기 학습 내용 H.. 2023. 3. 13.