CSS笔记01

news/2025/1/20 11:52:16/

黑马程序员视频地址:

前端Web开发HTML5+CSS3+移动web视频教程https://www.bilibili.com/video/BV1kM4y127Li?vd_source=0a2d366696f87e241adc64419bf12cab&spm_id_from=333.788.videopod.episodes

目录

引入方式

CSS特性

继承性

层叠性

优先级

Emmet写法

选择器

基础选择器

标签选择器

类选择器

id选择器

通配符选择器

复合选择器

后代选择器

子代选择器

并集选择器

交集选择器

伪类选择器

结构伪类选择器

伪元素选择器

文字控制属性 

字体大小 font-size

字体粗细 font-weight

字体样式(是否倾斜)font-style

行高 line-height

行高测量方法​编辑

行高垂直居中

字体族 font-family

复合属性 font

文本缩进 text-indent

内容水平对齐方式 text-align 

文字

图片 

文本修饰线 text-decoration

文字颜色 color

背景属性

背景图 background-image

背景图平铺方式 background-repeat

背景图位置 background-position

背景图缩放 background-size

背景图固定 background-attachment

背景复合属性 background

显示模式

转显示模式

盒子模型

组成部分

边框线 border

内边距 padding / padding-方位名词

內减模式 box-sizing

外边距 margin

外边距问题——合并现象

外边距问题——塌陷问题 

内外边距问题——行内元素

元素溢出 overflow

圆角 border-radius

阴影 box-shadow

清除默认样式


引入方式


CSS特性

继承性


层叠性


优先级


Emmet写法


选择器

基础选择器

标签选择器


类选择器


id选择器


通配符选择器


复合选择器

后代选择器


子代选择器


并集选择器


交集选择器


伪类选择器


结构伪类选择器


伪元素选择器


文字控制属性 


字体大小 font-size


字体粗细 font-weight


字体样式(是否倾斜)font-style


行高 line-height

 行高测量方法

行高垂直居中


 字体族 font-family

font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;


复合属性 font


 文本缩进 text-indent


内容水平对齐方式 text-align 

文字

图片 


文本修饰线 text-decoration


文字颜色 color


背景属性


背景图 background-image


背景图平铺方式 background-repeat


背景图位置 background-position


背景图缩放 background-size


背景图固定 background-attachment


背景复合属性 background


显示模式


转显示模式


盒子模型

组成部分


边框线 border


内边距 padding / padding-方位名词


內减模式 box-sizing


外边距 margin


外边距问题——合并现象


外边距问题——塌陷问题 


内外边距问题——行内元素


元素溢出 overflow


圆角 border-radius


阴影 box-shadow


清除默认样式

/* 清除默认内外边距 */ 
*{margin: 0;padding: 0;box-sizing: border-box;}/* 清除列表项目符号 */ 
li{
list-style: none;}

http://www.ppmy.cn/news/1564652.html

相关文章

python编程-OpenCV(图像读写-图像处理-图像滤波-角点检测-边缘检测)角点检测

角点检测(Corner Detection)是计算机视觉和图像处理中重要的步骤,主要用于提取图像中的关键特征,以便进行后续的任务,比如图像匹配、物体识别、运动跟踪等。下面介绍几种常用的角点检测方法及其应用。 1. Harris角点检…

04_角色创建窗口

将上文的登录窗口隐藏 创建空节点 作为创建角色窗口 命名为CreateWnd 创建输入的名字的输入框 再创建一个按钮用来随机角色名字 创建开始游戏按钮 End.

opencv3.4 ffmpeg3.4 arm-linux 交叉编译

一些依赖安装: sudo apt-get install pkg-config libgtk2.0-dev libavcodec-dev libavformat-dev libswscale-dev 交叉编译工具链准备:gcc-linaro-6.3.1 1、下载 https://github.com/FFmpeg/FFmpeg 解压后新建目录:Fmpeg-n3.4.13/ffmpeg…

STM32+W5500+以太网应用开发+003_TCP服务器添加OLED(u8g2)显示状态

STM32W5500以太网应用开发003_TCP服务器添加OLED(u8g2)显示状态 实验效果3-TCP服务器OLED1 拷贝显示驱动代码1.1 拷贝源代码1.2 将源代码添加到工程1.3 修改代码优化等级1.4 添加头文件路径1.5 修改STM32CubeMX工程 2 修改源代码2.1 添加头文件2.2 main函…

重学SpringBoot3-整合 Elasticsearch 8.x (二)使用Repository

更多SpringBoot3内容请关注我的专栏:《SpringBoot3》 期待您的点赞??收藏评论 整合 Elasticsearch 8.x (二)使用Repository 1. 环境准备 1.1 项目依赖1.2 Elasticsearch 配置 2. 使用Repository的基本步骤 2.1 创建实体类2.2 创建 Reposit…

python实现批量视频提取音频

1、安装依赖库 首先需要安装依赖库moviepy pip install moviepy 2、找到对应目录 利用listdir列出目标文件夹以下文件,利用os.path.join进行路径拼接,os.path.splitext()[0]扣掉。MP4后缀,加入所需形式,(这里用的是…

浅谈云计算16 | 存储虚拟化技术

存储虚拟化技术 一、块级存储虚拟化基础2.1 LUN 解析2.1.1 LUN 概念阐释2.1.2 LUN 功能特性 2.2 Thick LUN与Thin LUN2.2.1 Thick LUN特性剖析2.2.2 Thin LUN特性剖析 三、块级存储虚拟化技术实现3.1 基于主机的实现方式3.1.1 原理阐述3.1.2 优缺点评估 3.2 基于存储设备的实现…

使用 Python 开发一个 AI Agent 自媒体助手示例

1. 项目背景 随着自媒体行业的快速发展,内容创作者需要处理大量重复性任务,例如撰写文章、生成标题、优化关键词、分析数据等。通过开发一个 AI Agent 自媒体助手,可以帮助创作者高效完成这些任务,节省时间并提升内容质量。 本文…