css基础

最新推荐文章于 2024-10-09 19:16:55 发布

无敌CV工程师

最新推荐文章于 2024-10-09 19:16:55 发布

阅读量719

点赞数 25

分类专栏： css 文章标签： css 前端

本文链接：https://blog.csdn.net/2202_75345049/article/details/139449048

版权

css 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

css排版优化

简介

什么是 CSS?
CSS 指层叠样式表 (Cascading Style Sheets)
样式定义如何显示 HTML 元素
样式通常存储在样式表中
把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题
外部样式表可以极大提高工作效率
外部样式表通常存储在 CSS 文件中
多个样式定义可层叠为一个

选择器

在这里插入图片描述

样式表

外部样式表

在这里插入图片描述

内部样式表

在这里插入图片描述

外部样式表

在这里插入图片描述

内联样式

在这里插入图片描述

多重样式

在这里插入图片描述

背景

background-color  背景颜色
background-image  背景图像
background-repeat  背景是否平铺
background-attachment  背景是否固定
background-position 背景位置

背景简写
在这里插入图片描述

文本

颜色

在这里插入图片描述

对齐方式

在这里插入图片描述

文本修饰

在这里插入图片描述

文本转换

在这里插入图片描述

文本缩进

在这里插入图片描述

所有文本属性

在这里插入图片描述

字体

字体系列

在这里插入图片描述

字体样式

在这里插入图片描述

链接

在这里插入图片描述

表格

边框

在这里插入图片描述
高度与宽度

文本对齐

填充

颜色

盒子模型

在这里插入图片描述

边框

在这里插入图片描述

单独设置各边

简写

轮廓

在这里插入图片描述

外边距

在这里插入图片描述

填充

在这里插入图片描述

分组与嵌套

在这里插入图片描述

尺寸

在这里插入图片描述

显示与隐藏

在这里插入图片描述

定位

position 属性指定了元素的定位类型。

position 属性的五个值：

static
relative
fixed
absolute
sticky

元素可以使用的顶部，底部，左侧和右侧属性定位。然而，这些属性无法工作，除非是先设定position属性。他们也有不同的工作方式，这取决于定位方法。

在这里插入图片描述

布局

overflow

在这里插入图片描述

水平&垂直对齐

元素居中对齐
要水平居中对齐一个元素(如

), 可以使用 margin: auto;。

设置到元素的宽度将防止它溢出到容器的边缘。

元素通过指定宽度，并将两边的空外边距平均分配
在这里插入图片描述

浮动

元素怎样浮动
元素的水平方向浮动，意味着元素只能左右移动而不能上下移动。

一个浮动元素会尽量向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。

浮动元素之后的元素将围绕它。

浮动元素之前的元素将不会受到影响。

如果图像是右浮动，下面的文本流将环绕在它左边：
在这里插入图片描述

组合选择符

后代选择器

在这里插入图片描述

子元素选择器

在这里插入图片描述

相邻兄弟选择器

在这里插入图片描述

后续兄弟选择器

在这里插入图片描述

伪类

在这里插入图片描述

伪元素

在这里插入图片描述

注意："first-line" 伪元素只能用于块级元素。

注意： 下面的属性可应用于 "first-line" 伪元素：

font properties
color properties 
background properties
word-spacing
letter-spacing
text-decoration
vertical-align
text-transform
line-height
clear

在这里插入图片描述

注意： "first-letter" 伪元素只能用于块级元素。

注意： 下面的属性可应用于 "first-letter" 伪元素： 

font properties
color properties 
background properties
margin properties
padding properties
border properties
text-decoration
vertical-align (only if "float" is "none")
text-transform
line-height
float
clear