日常总结第一天（6.13）

最新推荐文章于 2024-08-28 15:34:24 发布

wf_ll

最新推荐文章于 2024-08-28 15:34:24 发布

阅读量335

点赞数 5

文章标签： css

本文链接：https://blog.csdn.net/wf_ll/article/details/139663405

版权

1. 什么是 CSS

简单来说，层叠样式表（ Cascading Style Sheet ）是一种专门用来控制界面外观风格的文档。

主要用于设置 HTML 页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。CSS以 HTML 为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体排版等，而且还可以针对不同的浏览器设置不同的样式。

2. CSS 使用方式 (3 种 )

2.1 行内样式

<!DOCTYPE html>

<head>

<title> This is title </title>

</head>

<body>

</body>

</html>

行内样式需要写到标签的 style 属性值中。

2.2 内部样式表

<!DOCTYPE html>

<head>

<title> Document </title>

<style>

p {

font-size : 16px ;

color : red ;

}

</style>

</head>

<body>

</body>

</html>

2.3 外部样式表

链接式

将样式写到单独的文件中，文件的扩展名为 .css 。例如， index.css 文件中有如下样式：

然后通过 <link> 元素将 index.css 文件引入到页面中：

p {

font-size : 16px ;

color : red ;

}

<!DOCTYPE html>

<head>

<title> This is title </title>

</head>

<body>

<p> 我是优秀的开发工程师 </p>

</body>

</html>

3.字体样式

3.1 font-size: 字号大小

3.11 px

px 单位名称为像素，像素是固定大小的单元 , 用于屏幕媒体 ( 即在电脑屏幕上读取 ) 。

3.2 font-family: 字体

font-family 属性用于设置字体。网页中常用的字体有宋体、微软雅黑、黑体等，例如将网页中所有段落文本的字体设置为微软雅黑，可以使用如下CSS 样式代码：

font-family: "微软雅黑";

3.3font-weight: 字体粗细

字体加粗除了用 b 和 strong 标签之外，可以使用 css 来实现，但是 css 是没有语义的。

font-weight 属性用于定义字体的粗细，其可用属性值： normal 、 bold 、 bolder 、 lighter 、 100~900

（ 100 的整数倍）。

代码：font-weight: 900;

3.4font-style: 字体风格

字体倾斜除了用 i 和 em 标签之外，可以使用 css 来实现，但是 css 是没有语义的。

font-style 属性用于定义字体风格，如设置斜体、倾斜或正常字体，其可用属性值如下：

normal ：默认值，浏览器会显示标准的字体样式。

italic ：浏览器会显示斜体的字体样式。

oblique ：浏览器会显示倾斜的字体样式。

4.CSS 注释

CSS 规则是使用 /* 需要注释的内容 */ 进行注释的，即在需要注释的内容前使用 “/*” 标记开始

注释，在内容的结尾使用 “*/” 结束。

例如: /* 所有的字体是 14 像素大小 */

5. 选择器

5.1 标签选择器

p {

font-size : 16px ;

color : red ;

}

选择页面中所有的 <p> 元素，给它们设置字体大小和颜色。

5.2 Class 选择器

.box {

font-size : 20px ;

color : green ;

}

选择页面中 class 属性值中包含 box 类名的所有元素，给它们设置字体大小和颜色。

5.3 ID 选择器

#nav {

font-size : 24px ;

color : blue ;

}

选择页面中 id 属性值是 nav 的元素，给它设置字体大小和颜色。

id 选择器和类选择器区别

W3C 标准规定，在同一个页面内，不允许有相同名字的 id 对象出现，但是允许相同名字的 class 。

类选择器（ class ）好比人的名字，是可以多次重复使用的，比如张伟王伟李伟李娜

id 选择器好比人的身份证号码，全中国是唯一的，不得重复。只能使用一次。

5.4 通配符选择器

* {

font-size : 24px ;

color : blue ;

}

wf_ll

关注

5
点赞
踩
7

收藏

觉得还不错? 一键收藏
1
评论
日常总结第一天（6.13）

网页中常用的字体有宋体、微软雅黑、黑体等，例如将网页中所有段落文本的字体设置为微软雅黑，可以使用如下CSS。页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体排版等，而且还可以针对不同的浏览器设置不同的样式。全中国是唯一的，不得重复。类名的所有元素，给它们设置字体大小和颜色。将样式写到单独的文件中，文件的扩展名为。：默认值，浏览器会显示标准的字体样式。的元素，给它设置字体大小和颜色。
复制链接

扫一扫