Study CSS

最新推荐文章于 2024-09-15 10:24:49 发布

Koite

最新推荐文章于 2024-09-15 10:24:49 发布

阅读量347

点赞数

文章标签： css html 前端

本文链接：https://blog.csdn.net/Koite/article/details/122149653

版权

本文详细介绍了CSS的引入方式、基础选择器、字体和文本样式、Chrome调试工具的使用，以及进阶的CSS选择器、背景相关属性、元素显示模式等。还探讨了CSS的定位原理和浮动，讲解了结构伪类选择器、伪元素选择器、盒子模型等，旨在帮助读者深入理解并掌握CSS的使用。

摘要由CSDN通过智能技术生成

CSS

css（层叠样式表）

如果给同一个标签设置了相同的样式，此时样式会层叠（覆盖），写在最下面的会生效

作用：给页面中的HTML标签设置样式

css写在style标签中，style标签一般写在head标签里面，titel标签下面

标签选择器：通过标签名，找到页面中所有这类标签，设置样式（如p{}）
类选择器：通过类名，知道页面中所有带有这个类型的标签，设置样式

给标签设置一个类名（如<p class="one">,class是属性名，引号中加类名）

如（.one{}）

类名可以由数字，下划线，中划线，字母组成，但不能以数字或者中划线开头

一个标签可以使用多个类名，类名之间用空格隔开（如：<p class="one size">）
id选择器：通过id属性值，找到页面中带有这个id属性值的标签，设置样式

#id属性值{css属性名：属性值；}

id属性在一个页面中是唯一的，不能重复（一个标签上只能有一个id属性值，一个id选择器只能选中一个标签）
通配符选择器：找到页面中所有的标签，设置样式

*{css属性名：属性值；}

字体样式

font-family:微软雅黑，黑体，sans-serif;意为如果用户电脑没有微软雅黑字体，就用黑体，如果没有黑体，就用sans-serif（非衬线字体系列）

简写：font： style weight size 字体；（如：font: italic 700 20px 楷体;）如果想修改单个属性，在下面重写单个属性

可以省略前两个，但是必须按照顺序填写。

复合属性：一个属性符号后面书写多个值的写法

文本样式：

属性名	取值	注意点
text-indent （文本缩进）	数字+px，数字+em （1em=当前标签的font-size的大小）
text-align （文本水平对齐方式）	left：左对齐 center：居中对齐 right：右对齐	可以让span，a，文本，input，img标签居中，需要在body（父元素）设置
text-decoration（文本修饰）	underline：下划线 line-through：删除线 overline：上划线 none：无装饰线
line-height（行高）	数字+px 倍数（当前标签font-size的倍数）

font：style weight size/line-height family；

颜色常见取值：了解

如：文字颜色：color

背景颜色：background-color

属性值：