목차
文章内容
section级内容的正文
웹 프론트엔드 HTML 튜토리얼 CSS3学习选择器、字体_html/css_WEB-ITnose

CSS3学习选择器、字体_html/css_WEB-ITnose

Jun 24, 2016 pm 12:05 PM
css3 세례반 공부하다 선택자

??

属性选择器:
[att*=val]{}若att元素属性值包含val指定字符,则使用该样式
[att^=val]{}若att元素属性值开头字符为val,则使用该样式
[att&=val]{}若att元素属性值结尾字符为val,则使用该样式

例:

<style type="text/css">[id^=section1]{		background-color: yellow;	}</style>
로그인 후 복사

<div id="section2">示例文本2</div>	<div id="subsection1">示例文本1-1</div>	<div id="subsection2">示例文本1-2</div>	<div id="subsection2-1">示例文本2-1</div>	<div id="subsection2-2">示例文本2-2</div>
로그인 후 복사


target选择器:

页面内href跳转时,重新定义目标的属性


font字体:以前的版本网页中应用的特殊字体只有在客户端有这个字体时候该字体才能正常显示,

而css3支持从服务器中获取字体,也就是说你把字体文件放到font文件夹,可以直接通过url使用这个字体

这一新的变化真的带来了很大的便利。例:

@font-face{		font-family: WebFont;		src:url('font/FZJZFW.TTF') format("truetype");		font-weight: normal;	}
로그인 후 복사
article{		font-family: WebFont;	}
로그인 후 복사

<article>	<h1 id="文章内容">文章内容</h1>	<p>网页级内容区块的正文</p>	<section>		<h3 id="section级内容的正文">section级内容的正文</h3>		<p>section级内容区块的正文</p>	</section></article>
로그인 후 복사



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

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25 : Myrise에서 모든 것을 잠금 해제하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Apple 휴대폰의 Outlook에서 글꼴을 변경하는 방법 Apple 휴대폰의 Outlook에서 글꼴을 변경하는 방법 Mar 08, 2024 pm 04:46 PM

Apple 휴대폰에서 Outlook의 글꼴을 변경하는 방법 먼저 Outlook 소프트웨어를 열고 인터페이스 왼쪽 상단에 있는 파일을 클릭하세요. 원하는 대로 글꼴을 설정할 수 있습니다. 설정이 완료되면 확인 버튼을 클릭하세요. 한 번 보자! Apple 휴대폰에서 Outlook의 글꼴을 변경하는 방법 1. Outlook 소프트웨어를 열고 인터페이스 왼쪽 상단에 있는 "파일" 옵션을 클릭합니다. 2. 나타나는 목록에서 "옵션"을 찾아 클릭하여 들어갑니다. 3. 옵션 목록 왼쪽에서 "메일"을 클릭하세요. 4. 다음으로 “문자 및 글꼴”을 선택하세요. 5. 새 이메일, 답장 이메일 또는 작성에 대한 글꼴을 설정하려면 해당 옵션을 클릭하여 설정으로 들어갑니다. 6. 개인 취향에 맞게 글꼴을 설정한 후 확인을 클릭하세요.

생체 휴대폰 글꼴을 더 크게 만드는 방법 및 설정 위치 생체 휴대폰 글꼴을 더 크게 만드는 방법 및 설정 위치 Feb 24, 2024 pm 06:16 PM

생체 휴대폰의 글꼴 크기를 어떻게 크게 설정할 수 있나요? 생체 휴대폰에서 글꼴 크기를 더 크게 만들 수 있지만 대부분의 사용자는 생체 휴대폰의 글꼴 크기를 설정하는 방법을 모릅니다. , 편집기는 생체 휴대폰의 글꼴 크기를 더 크게 만드는 방법에 대한 설정을 제공합니다. 방법 그래픽 튜토리얼, 관심 있는 사용자가 와서 살펴보세요! Vivo 휴대폰 사용 튜토리얼 생체 휴대폰의 글꼴 크기를 더 크게 만드는 방법 설정 위치 1. 먼저 생체 휴대폰에서 [설정] 기능을 열고 클릭합니다. 2. 그런 다음 설정 인터페이스로 이동하여 다음을 찾습니다. 3. 그런 다음 아래 그림의 페이지로 이동하여 [글꼴 크기 및 두께] 서비스를 클릭합니다. 4. 마지막으로 아래 그림의 가로선을 밀어 글꼴 크기를 조정합니다.

샤오미 11 글꼴 변경하는 방법_샤오미 11 글꼴 변경하는 방법 샤오미 11 글꼴 변경하는 방법_샤오미 11 글꼴 변경하는 방법 Mar 25, 2024 pm 07:26 PM

1. 휴대폰 설정을 열고 [디스플레이]를 클릭하세요. 2. [글꼴]을 클릭하세요. 3. 마음에 드는 글꼴을 선택하거나 [글꼴 더보기]를 클릭해 앱을 다운로드하세요.

모바일QQ 브라우저에서 글꼴을 변경하는 방법 모바일QQ 브라우저에서 글꼴을 변경하는 방법 Apr 07, 2024 pm 06:43 PM

모바일QQ 브라우저에서 글꼴을 변경하는 방법은 무엇입니까? 많은 사람들이 휴대폰에서 QQ 브라우저를 사용하는 것을 좋아합니다. 이 브라우저는 웹 페이지를 빠르게 검색할 수 있을 뿐만 아니라 다양한 유형의 파일 데이터를 처리할 수도 있습니다. 또한 이 브라우저는 사용자에 따라 브라우저의 글꼴을 설정할 수 있습니다. 많은 초보 사용자는 여전히 이 브라우저의 글꼴을 변경하는 방법을 모릅니다. 이 글에서는 모바일 QQ 브라우저에서 글꼴을 변경하는 단계에 대한 개요를 제공하여 문제 해결에 도움이 되기를 바랍니다. 모바일 QQ 브라우저에서 글꼴을 변경하는 단계 목록 1. 휴대폰을 켠 다음 "QQ 브라우저"를 클릭하여 엽니다(그림 참조). 2. QQ 브라우저의 "내" 페이지에서 오른쪽 상단에 있는 "설정" 로고를 클릭합니다(그림 참조). 3. 설정에서 클릭하여 "글꼴 설정"으로 들어갑니다(그림 참조).

Apple 휴대폰에서 글꼴을 변경하는 방법 Apple 휴대폰에서 글꼴을 변경하는 방법 Apple 휴대폰에서 글꼴을 변경하는 방법 Apple 휴대폰에서 글꼴을 변경하는 방법 Mar 22, 2024 pm 08:11 PM

1. 설정을 통해 휴대폰 시스템의 글꼴 스타일을 입력하고 수정합니다. 2. 휴대폰 설정을 열고 [접근성]을 입력하세요. 3. [자막 및 비공개 자막]을 클릭하세요. 4. [스타일]을 클릭하여 수정하세요.

C 언어의 매력을 밝히다: 프로그래머의 잠재력을 발견하다 C 언어의 매력을 밝히다: 프로그래머의 잠재력을 발견하다 Feb 24, 2024 pm 11:21 PM

C 언어 학습의 매력: 프로그래머의 잠재력을 여는 것 지속적인 기술 발전으로 컴퓨터 프로그래밍은 많은 주목을 받는 분야가 되었습니다. 많은 프로그래밍 언어 중에서 C 언어는 항상 프로그래머들에게 사랑을 받아 왔습니다. C 언어의 단순성, 효율성 및 폭넓은 적용 덕분에 많은 사람들이 프로그래밍 분야에 입문하는 첫 번째 단계는 C 언어입니다. 이 기사에서는 C 언어 학습의 매력과 C 언어 학습을 통해 프로그래머의 잠재력을 발휘하는 방법에 대해 설명합니다. 우선, C 언어 학습의 매력은 단순함에 있습니다. C언어는 다른 프로그래밍 언어에 비해

Pygame 시작하기: 종합적인 설치 및 구성 튜토리얼 Pygame 시작하기: 종합적인 설치 및 구성 튜토리얼 Feb 19, 2024 pm 10:10 PM

처음부터 Pygame 배우기: 전체 설치 및 구성 튜토리얼, 특정 코드 예제 필요 소개: Pygame은 Python 프로그래밍 언어를 사용하여 개발된 오픈 소스 게임 개발 라이브러리로, 개발자가 다양한 유형을 쉽게 만들 수 있도록 풍부한 기능과 도구를 제공합니다. 게임의. 이 기사는 처음부터 Pygame을 배우는 데 도움이 될 것이며, 완전한 설치 및 구성 튜토리얼과 빠른 시작을 위한 특정 코드 예제를 제공할 것입니다. 1부: Python 및 Pygame 설치 먼저 다음 사항을 확인하세요.

워드에서 근수를 입력하는 방법을 함께 알아볼까요? 워드에서 근수를 입력하는 방법을 함께 알아볼까요? Mar 19, 2024 pm 08:52 PM

Word에서 텍스트 내용을 편집할 때 수식 기호를 입력해야 하는 경우가 있습니다. 어떤 사람들은 Word에서 근수를 입력하는 방법을 모르기 때문에 편집자에게 Word에서 근수를 입력하는 방법에 대한 튜토리얼을 친구들과 공유해달라고 요청했습니다. 그것이 내 친구들에게 도움이 되기를 바랍니다. 먼저 컴퓨터에서 Word 소프트웨어를 연 다음 편집하려는 파일을 열고 루트 기호를 삽입해야 하는 위치로 커서를 이동합니다. 아래 그림 예를 참조하세요. 2. [삽입]을 선택한 후, 기호에서 [수식]을 선택하세요. 아래 그림의 빨간색 원과 같이 3. 아래의 [새 수식 삽입]을 선택하세요. 아래 그림의 빨간색 원과 같이 4. [부수]를 선택한 후 해당 부수를 선택합니다. 아래 그림의 빨간색 원에 표시된 대로:

See all articles