>  기사  >  웹 프론트엔드  >  CSS 스타일 시트 란 무엇입니까?

CSS 스타일 시트 란 무엇입니까?

青灯夜游
青灯夜游원래의
2021-04-02 15:57:146799검색

css 스타일 시트는 CSS(Cascading Style Sheets)를 말하며, HTML이나 XML 등의 파일 스타일을 표현하는 데 사용되는 컴퓨터 언어입니다. 웹 페이지를 구분하는 스타일 언어입니다. 그리고 내용.

CSS 스타일 시트 란 무엇입니까?

이 튜토리얼의 운영 환경: Windows 7 시스템, CSS3 버전, Dell G3 컴퓨터.

CSS 스타일 시트는 일반적으로 CSS (계단식 스타일 시트)를 나타냅니다.

Cascading Style Sheets(영어 정식 이름: Cascading Style Sheets)는 HTML(Standard Generalized Markup Language의 응용 프로그램) 또는 XML(Standard Generalized Markup Language의 하위 집합)과 같은 파일 스타일을 표현하는 데 사용되는 컴퓨터 언어입니다. HTML 스타일을 나타내는 데 사용되는 언어는 웹 페이지와 콘텐츠를 분리 할 수있는 스타일 언어입니다.

CSS는 주로 웹 페이지의 스타일을 디자인하고 웹 페이지를 아름답게 만드는 데 사용됩니다. 웹 페이지를 정적으로 수정할 수 있을 뿐만 아니라 다양한 스크립트 언어와 함께 웹 페이지의 다양한 요소의 형식을 동적으로 지정할 수도 있습니다.

CSS는 웹 페이지의 요소 위치 레이아웃에 대해 픽셀 수준의 정밀한 제어를 수행할 수 있고 거의 모든 글꼴 크기 스타일을 지원하며 웹 페이지 개체 및 모델 스타일을 편집할 수 있는 기능을 갖추고 있습니다.

css 정의의 구성

css 정의는 선택기, 속성, 속성 값의 세 부분으로 구성됩니다.

选择符{属性:属性值;}

1 선택기: 선택기라고도 하며 HTML 언어의 모든 태그는 장치에서 제어하는 ​​다른 CSS를 통해 선택됩니다.

2. 속성: 주로 글꼴 속성, 텍스트 속성, 배경 속성, 레이아웃 속성, 테두리 속성, 목록 항목 속성, 테이블 속성 등을 포함합니다. 이러한 속성 중 일부는 일부 브라우저에서만 지원되므로 CSS 속성 사용이 더 복잡해집니다

3. 속성 값: 특정 속성의 유효한 값입니다. 속성 및 속성 값은 ":"세미콜론으로 분리됩니다. 여러 속성이 있으면 사용합니다. "

예:

<style>
h2{
font-family:宋体;
color:red;
}
</style>

(학습 동영상 공유: css 동영상 튜토리얼)

참고: h2는 선택기입니다. " "宋体"는 속성 값h2 为选择器;font-family 为属性;“宋体”为属性值

css选择器

常用的有标记选择器,类别选择器,id选择器等。

1)标记选择器(又叫元素选择器,类型选择器)

what:HTML页面是由很多标记组成的,例如图像标记a1f02c36ba31691bcfe87b2722de723b、超链接标记3499910bf9dac5ae3c52d5ede7383485、表格标记f5d188ed2c074f8b944552db028f98a1等。而css标记选择器就是声明页面中哪些标记采用css样式。

举例:

<style>
a{
font-size:9px;
color:#F93;
}
<style>

2)类别选择器

格式: 点(.)+类别名称

使用标记选择器有局限性。如果声明标记选择器,那么页面中所有该标记内容都会发生变化。假设页面中有3个c1a436a314ed609750bd7c7d319db4da标记,若想每个c1a436a314ed609750bd7c7d319db4da的显示效果都不一样,则可以使用类别标记器。

  • 类别选择器的HTML标记,只需使用class属性来声明即可。

  • 在HTML标签中,可以应用多种类别选择器,这样可以使HTML同时加载多个类别选择器的样式。在多种类别选择器之间用空格进行分割,例如:4b2d7976a7bb185c901d374474f709c3。

3)id选择器

id选择器是通过HTML页面中的id属性来选择添加样式,与类别选择器基本相同。

格式:"#"+id 属性值

css 선택기

자주 사용되는 태그 선택기, 카테고리 선택기, ID 선택기 등입니다.

🎜1) 태그 선택기(요소 선택기, 유형 선택기라고도 함)🎜🎜무엇: HTML 페이지는 이미지 태그a1f02c36ba31691bcfe87b2722de723b, 하이퍼링크 태그3499910bf9dac5ae3c52d5ede7383485, 테이블 태그f5d188ed2c074f8b944552db028f98a1등과 같은 많은 태그로 구성됩니다. CSS 태그 선택기는 페이지의 어떤 태그가 CSS 스타일을 채택하는지 선언합니다. 🎜🎜예:🎜rrreee🎜2) 카테고리 선택기🎜🎜형식: 포인트(.)+카테고리 이름🎜🎜태그 선택기 사용에는 제한이 있습니다. 태그 선택기를 선언하면 페이지의 해당 태그의 모든 내용이 변경됩니다. 페이지에 3 개의 H2 & gt가 있다고 가정합니다. 🎜
  • 🎜 CARCITY 선택기의 HTML 태그는 클래스 속성을 사용하여 선언 할 수 있습니다. 🎜
  • 🎜HTML 태그에서는 여러 카테고리 선택기를 적용할 수 있으며, 이를 통해 HTML은 여러 카테고리 선택기의 스타일을 동시에 로드할 수 있습니다. 공백을 사용하여 여러 범주 선택기를 분리합니다. 🎜
🎜3) id 선택기 🎜🎜 id 선택기는 HTML 페이지의 id 속성을 통해 스타일을 선택하고 추가하는 기능으로 기본적으로 카테고리 선택기와 동일합니다. 🎜🎜형식: "#"+id 속성 값🎜🎜 명명된 ID 선택기는 "#" 기호로 시작해야 하며 그 뒤에 HTML 태그의 id 속성 값이 와야 합니다. . 🎜🎜더 많은 프로그래밍 관련 지식을 보려면 🎜프로그래밍 비디오🎜를 방문하세요! ! 🎜

위 내용은 CSS 스타일 시트 란 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.