当前位置：首页 > news >正文

【10.HTML入门知识-CSS元素定位】

news 2026/3/31 20:19:47

1 标准流（Normal Flow）

默认情况下，元素都是按照normal flow（标准流、常规流、正常流、文档流【document flow】）进行排布
 从左到右、从上到下按顺序摆放好
 默认情况下，互相之间不存在层叠现象

1.1 margin-padding位置调整

在这里插入图片描述

1.1 画布和视口

在这里插入图片描述

2 认识position属性

除了static,其他定位属性都会脱标(自定义位置)
在这里插入图片描述

position值对比

在这里插入图片描述

2.1 静态定位 - static

会占据标准布局空间

在这里插入图片描述

2.2 相对定位 - relative

会占据标准布局空间
在这里插入图片描述

2.3 固定定位 - fixed

不会占据标准布局空间
在这里插入图片描述

2.4 绝对定位 - absolute

不会占据标准布局空间
在这里插入图片描述

2.5 子绝父相

在这里插入图片描述

2.6 将position设置为absolute/fixed元素的特点

在这里插入图片描述

2.7.粘性定位 - sticky

在这里插入图片描述

3 层叠 CSS属性 - z-index

在这里插入图片描述

【10.HTML入门知识-CSS元素定位】

1 标准流（Normal Flow） 默认情况下，元素都是按照normal flow（标准流、常规流、正常流、文档流【document flow】）进行排布  从左到右、从上到下按顺序摆放好  默认情况下，互相之间不存在层叠现象 1.1…...

编程日记 2023/5/2 19:02:47

LeetCode_贪心算法_简单_455.分发饼干

目录 1.题目2.思路3.代码实现（Java） 1.题目假设你是一位很棒的家长，想要给你的孩子们一些小饼干。但是，每个孩子最多只能给一块饼干。对每个孩子 i，都有一个胃口值 g[i]，这是能让孩子们满足胃口的饼干的…...

编程日记 2023/5/2 18:57:46

HashMap

目录 HashMap是什么？ 为什么要使用HashMap？ HashMap存储元素原理（put⽅法） 扰动函数前置知识异或运算 &运算为什么使用扰动函数实验验证扰动函数常见问题 HashMap的默认长度是多少？ HashMap是先扩…...

编程日记 2023/5/2 18:52:45

数据结构初阶 —— 树（堆）

目录一，堆堆的概念向下调整法（数组） 向上调整法（数组） 堆的创建（建堆） 堆的实现一，堆堆的概念如有个关键码的集合K{，，，...&#xf…...

编程日记 2023/5/30 1:40:35

一文看懂低代码，5分钟从入门到原理全搞定

全球低代码市场已经走过了近20年，中国低代码市场近5年经历了百花齐放的广泛探索阶段，更旺盛的市场需求逐步在被激发。现在，让我们按下暂停键，看看这些产品给我们呈现了低代码市场一幅怎样的百景图。低代码平台简介广义上的低代…...

编程日记 2023/5/2 18:42:43

MetaERP系统主要干什么的，华为自研ERP的路子是否可以效仿？

近日，华为成功研发出自主可控的MetaERP系统，并完成了对旧有ERP系统的替换。该系统采用全栈自主可控技术，基于华为欧拉操作系统、GaussDB等根技术，采用云原生架构、元数据多租架构、实时智能技术等，提高业务效率&#x…...

编程日记 2023/5/2 18:37:42

自动驾驶——离散LQR的黎卡提方程Riccati公式推导与LQR工程化

1.LQR Question Background 之前写过连续系统的黎卡提方程Riccati推导，但是考虑到实际工程落地使用的是离散系统，于是又进行了离散黎卡提方程Riccati的公式推导。 2.Proof of Riccati Equation Formula for Discrete Systems 工程化落地，就…...

编程日记 2023/5/2 18:32:41

28.Mybatis的入门

目录一、Mybatis的入门。 （1）Mybatis的简介。 （2）Mybatis的快速入门。 （2.1）快速入门。 （2.2）UserMapper.xml文件。 （2.3）sqlMapConfig.xml文件。 …...

编程日记 2023/5/2 18:27:40

Android Jetpack 从使用到源码深耕【ViewModel从实践到原理】（三）

上文，我们通过简单的ViewModel使用源码入手，对其源码进行阅读，原理进行了简单总结，简单来说，ViewModel是通过Activity的onRetainNonConfigurationInstance 与 getLastNonConfigurationInstance的自动调用，实现了 ViewModel数据的存储和恢复，数据存储在ViewModelStore的m…...

编程日记 2023/5/2 18:22:38

什么性格的人适合报考环境科学类专业？高考选专业

环境科学类专业包括有：环境科学与工程，环境工程，环境科学，环境生态工程，环保设备工程，资源环境科学，水质科学与技术。环境对于未来是一个极其重要的方向，需要学生具备一定的科学素…...

编程日记 2023/5/29 17:50:31

Python中的异常处理机制可以帮助程序员在程序运行过程中遇到错误时进行处理

Python中的异常处理机制可以帮助程序员在程序运行过程中遇到错误时进行处理，防止程序崩溃或出现不可预测的错误。 Python中的异常处理使用try-except语句。try语句块包含可能会出现异常的代码，而except语句块则定义了出现异常时应该执行的操作。下面是一…...

编程日记 2023/5/29 19:07:58

TCP之报文格式解析

TCP网络协议是较常用的，也基本上都会接触，那么来简单了解下它吧。TCP 是一种面向连接的、可靠的传输协议，它能够将数据分成一些小块，并通过 Internet 进行传输。在 TCP 中，数据被分割成一些称为 TCP 报文段&#xff08…...

编程日记 2023/5/29 19:09:05

文章目录测试代码makefile运行 qemu调试 qemuGDB 常用命令裸机篇系列文章主要用于熟悉 arm 汇编及处理器结构测试代码 _start:ldr r0, 0X020C4068 /* CCGR0 */ldr r1, 0XFFFFFFFF str r1, [r0]ldr r0, 0X020C406C /* CCGR1 */str r1, [r0]ldr r0, 0X020C4070 …...

编程日记 2023/5/2 18:02:31

JSP+SQL基于JSP的学生信息管理系统(源代码+论文+答辩PPT)

随着学校规模的不断扩大，学生数量急剧增加，有关学生的各种信息也成倍增长。面对如此庞大的信息量，开发学生信息管理系统来提高学生管理工作的效率就成为必然。通过该系统，可以做到信息的规范管理、科学统计和快速查询，…...

编程日记 2023/5/2 17:57:30

docker上部署程序后无法连接数据库的问题

咱就是说，这个问题差点给我劝退docker。下面说下环境情况。装了个javaweb程序容器，装了个数据库容器，javaweb容器就是链接不上数据库。咱也是跟着菜鸟教程的容器互联步骤简历网络链接： 并且启动时增加--networkxxx 都加入到了…...

编程日记 2023/5/2 17:52:29

Ucore lab4

实验目的了解内核线程创建/执行的管理过程了解内核线程的切换和基本调度过程实验内容练习一：分配并初始化一个进程控制块 1.内核线程及管理内核线程是一种特殊的进程，内核线程与用户进程的区别有两个：内核线程只运行在内核态&#x…...

编程日记 2023/5/2 17:47:28

AI失业潮来袭，某些部门裁员过半

历史的车轮滚滚向前，每次生产力的大幅跃进，都会造成一批失业潮。想当年，纺纱机的出现让无数手工作坊的织布师傅失业。如今，在AI技术的催化下，同样的事正在互联网行业的各个领域重演。疯狂的裁员浪潮 “AI15秒做的&am…...

编程日记 2023/5/2 17:42:27

git 撤销add/commit，以及更换源命令

前言：主要是为了自己方便记录，省的每次都查找一下这些命令 1、当我们只是想撤回commit，保留add .的时候，可以用下方代码 git reset --soft HEAD^ 2、当我们想撤回commit以及add .的时候，可以用下方代码 git reset…...

编程日记 2023/5/2 17:37:26

3dMax需要什么样的硬件环境才能更好的工作？

3dMax官方给出了系统要求的列表，可用于帮助确保系统中的硬件能够与他们的软件一起工作。但是，这个“系统要求”列表只涵盖了运行软件所需硬件的最基本知识，而不是实际提供最佳性能的硬件。由于这些列表的不一致程度，我们花时间进行测试以确定运行 3dMax 的最佳硬件。基于…...

编程日记 2023/5/2 17:32:25

python-使用Qchart总结4-绘制多层柱状图

1、上代码 import sysfrom PyQt5.QtChart import QChart, QChartView, QBarCategoryAxis, QValueAxis, QBarSeries, QBarSet from PyQt5.QtGui import QPainter, QColor from PyQt5.QtWidgets import QMainWindow, QApplicationfrom untitled import Ui_MainWindow #从生成好的…...

编程日记 2023/5/2 17:27:18

1 标准流（Normal Flow）

1.1 margin-padding位置调整

1.1 画布 和 视口

2 认识position属性

position值对比

2.1 静态定位 - static

2.2 相对定位 - relative

2.3 固定定位 - fixed

2.4 绝对定位 - absolute

2.5 子绝父相

2.6 将position设置为absolute/fixed元素的特点

2.7.粘性定位 - sticky

3 层叠 CSS属性 - z-index

相关文章：

1.1 画布和视口