CSS入门教程：选择器与样式引入

需积分: 9 169 浏览量更新于2024-08-05 收藏 3.29MB PDF 举报

身份认证购VIP最低享 7 折!

领优惠券(最高得80元）

"这是一份关于CSS的学习笔记，涵盖了CSS的基本概念、引入方式、选择器的使用等内容。" 在网页设计中，CSS（层叠样式表）起着至关重要的作用，它负责定义网页的外观和布局。本笔记主要围绕以下几个知识点展开： 1. **CSS简介** CSS与HTML协同工作，HTML负责构建网页的结构，而CSS则负责呈现这个结构的样式。随着技术的发展，虽然CSS3已经成为主流，但了解CSS2的基础对于理解CSS3至关重要，因为许多浏览器仍支持CSS2的特性。 2. **CSS引入方式** - **外部样式表**：通过`<link>`标签引用一个外部CSS文件，这是最常见的方式，适用于大型项目，便于管理和维护样式。 - **内部样式表**：在`<head>`标签内使用`<style>`标签定义CSS，适用于整个网页的统一风格。 - **行内样式表**：直接在HTML元素中使用`style`属性定义样式，这种方式灵活性高但不易维护，通常用于特殊情况或临时样式调整。 3. **CSS选择器** - **ID选择器**：使用`#`标识符选择具有特定ID的元素，如`#lvye`，确保页面中唯一。 - **类选择器**：使用`.`标识符选择具有特定类的元素，如`.lv`，一个类可以应用于多个元素。 - **后代选择器**：通过空格分隔选择器，如`#father1 div`，选择`father1` ID下的所有`div`元素。 - **群组选择器**：使用逗号分隔多个选择器，如`h3, div, p, span`，一次性设置多个元素的样式。 4. **样式声明** 每个样式声明由属性名、冒号和属性值组成，如`color:red;`，每个声明结束后应使用分号（;）进行分隔。 5. **CSS语法** 正确的CSS语法结构为属性名后面跟一个冒号，然后是属性值，两者之间无空格，值后加分号结束，如`body {color: black;}`。这份笔记还涉及到了一些选择器的实战应用，例如后代选择器和群组选择器的用法，以及如何通过ID和类选择器对特定元素进行样式设定。通过这些知识点的学习，读者可以更好地理解和掌握CSS在网页设计中的运用。

资源详情

资源推荐

B. 后代选择器选择的不仅是⼦元素，还包括它的其他后代元素（如孙元素）!

C. 群组选择器可以对⼏个选择器进⾏相同的操作!

D. 想要为某⼀个元素定义样式，我们可以使⽤不同的选择器来实现!

第13章字体样式!

字体类型!

p{font-family:Arial,Verdana,Georgia;}!

字体⼤⼩（font-size）!

font-size:像素值; small、medium、large!

字体粗细（font-weight）!

font-weight:取值;!

字体⻛格（font-style）!

font-style:取值;!

字体颜⾊（color）!

color:颜⾊值;!

13.7 CSS注释!

/*注释的内容*/!

1. CSS中可以使⽤（　）属性来定义字体粗细。!

A. font-family!

mrs

依次

类

推

像素值

剩余11页未读，继续阅读

不爱编程的猫

粉丝: 1
资源: 2

CSS入门教程：选择器与样式引入

HTMLCSS笔记.pdf

狂神说视频-CSS笔记.pdf

如何使电脑和手机同时访问网页时，js实现给电脑访问的网页引用css1.css样式，给手机端引用css2.css样式

bootstrap/dist/css/bootstrap.min.css in ./src/plugins/index.js如何解决

postcss.config.js

[data-xx] .css 与 .css[data-xx] 的区别

vite postcss.config.js怎么引入

php中css和css.php的区别

postcss.config.js是干啥的

com.itextpdf.text.pdf.PdfReader 依赖

postcss.config.cjs

php中怎么创建css和css.php

前端项目的 postcss.config.js 文件是干什么的

安装postcss-pxtorem不会自动创建postcss.config.js文件吗

nuxt怎么postcss.config.js第一次

postcss.config.js引入到vite

error from PostCSS plugin. Your current PostCSS version is 7.0.39, but autoprefixer uses 6.0.23. Per haps this is the source of the error below.

java html转pdf

<link rel="stylesheet" type="text/css" href="css/visual.css">

实现前端引入bootcss的CDN链接: exceljs.min.css，请给我5个

最新资源