CSS笔记基础篇02——浮动、标准流、定位、CSS精灵、字体图标
黑马程序员视频地址：
前端Web开发HTML5+CSS3+移动web视频教程https://www.bilibili.com/video/BV1kM4y127Li?vd_source=0a2d366696f87e241adc64419bf12cab&spm_id_from=333.788.videopod.episodes&p=70
https://www.bilibili.com/video/BV1kM4y127Li?vd_source=0a2d366696f87e241adc64419bf12cab&spm_id_from=333.788.videopod.episodes&p=70
目录
标准流
浮动（不推荐）
清除浮动
Flex布局（推荐）
初识
总结
创建flex容器 display:flex
主轴对齐方式 justify-content
侧轴对齐方式 align-items
修改主轴方向 flex-direction
弹性伸缩比 flex
弹性盒子换行 flex-wrap
行对齐方式 align-content
定位
分类
相对定位 relative
绝对定位 absolute
固定定位 fixed
堆叠层级 z-index
高级技巧
CSS精灵
字体图标
下载字体
使用字体
上传矢量图
CSS修饰属性
垂直对齐方式 vertical-align
过渡 transition
透明度 opacity
光标类型 cursor
网站搭建
项目目录
准备工作
SEO
favicon图标
标准流
浮动（不推荐）
清除浮动
方法三中的before伪元素是为了解决外边距塌陷问题
Flex布局（推荐）
初识
总结
创建flex容器 display:flex
主轴对齐方式 justify-content
侧轴对齐方式 align-items
修改主轴方向 flex-direction
弹性伸缩比 flex
弹性盒子换行 flex-wrap
行对齐方式 align-content
定位
分类
相对定位 relative
绝对定位 absolute
父相的原因：特点第三条，因为绝对定位会找最近的已经定位的父级
固定定位 fixed
堆叠层级 z-index
高级技巧
CSS精灵
字体图标
下载字体
iconfont-阿里巴巴矢量图标库
使用字体
上传矢量图
CSS修饰属性
垂直对齐方式 vertical-align
图片与文字不对齐原因：浏览器会把行内块、行内标签当成文字处理，统一按照基线对齐
过渡 transition
透明度 opacity
光标类型 cursor
网站搭建
项目目录
准备工作
SEO
favicon图标
相关文章：
CSS笔记基础篇02——浮动、标准流、定位、CSS精灵、字体图标
黑马程序员视频地址： 前端Web开发HTML5CSS3移动web视频教程https://www.bilibili.com/video/BV1kM4y127Li?vd_source0a2d366696f87e241adc64419bf12cab&spm_id_from333.788.videopod.episodes&p70https://www.bilibili.com/video/BV1kM4y127Li?vd_source…...
C++ 面向对象（继承）
三、继承 3.1 继承的概念 基于一个已有的类 去重新定义一个新的类，这种方式我们叫做继承 关于继承的称呼 一个类B 继承来自 类 A 我们一般称呼 A类：父类 基类 B类: 子类 派生类 B继承自A A 派生了B 示例图的语法 class vehicle // 车类 {}class …...
Top期刊算法！RIME-CNN-BiLSTM-Attention系列四模型多变量时序预测
Top期刊算法！RIME-CNN-BiLSTM-Attention系列四模型多变量时序预测 目录 Top期刊算法！RIME-CNN-BiLSTM-Attention系列四模型多变量时序预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 基于RIME-CNN-BiLSTM-Attention、CNN-BiLSTM-Attention、R…...
数据结构 数组
1. 常见的错误 这里我要特别纠正一个“错误”。我在面试的时候，常常会问数组和链表的区别，很多人都回答说，“链表适合插入、删除，时间复杂度O(1)；数组适合查找，查找时间复杂度为O(1)”。 实际上ÿ…...
Kivy App开发之UX控件Bubble气泡
kivy提供了一个提示气泡的小控件Bubble，使用时可以指定气泡箭头的方向以及显示的图像，还可以作为容器添加其他小控件。 常用属性如下 属性说明orientation气泡内子项的排序方式，可设置为vertical或horizontal，默认horizontalarrow_pos箭头相对于气泡的位置，可设置为left_…...
从零到一：打造属于你的AI智能体，支持本地部署
国外卷智能体，国内也都在搞 AI Agent，2025 年也将成为 Agent 的元年。构建智能体主要两种情况，一个是工作流模式，另外一种是直接开发应用，接下来分别给大家介绍一下两种产品和构建过程。工作流模式，以 Coze…...
成就与远见：2024年技术与思维的升华
个人主页：chian-ocean 前言: 2025年1月17日，2024年博客之星年度评选——创作影响力评审的入围名单公布。我很荣幸能够跻身Top 300，虽然与顶尖博主仍有一定差距，但这也为我提供了更加明确的发展方向与指引。展望崭新的2025年&…...
深搜与回溯——扫地机器人问题解析与代码实现
一、题目内容 题目描述 扫地机器人在一个 nm 的网格中从左上角（1,1）开始清扫。它按照以下规则移动： 如果当前位置的右边（同一行，下一列）没有被清扫过，它会向右移动。 如果右边无法移动…...
【大数据2025】Hadoop 万字讲解
文章目录 一、大数据通识大数据诞生背景与基本概念大数据技术定义与特征大数据生态架构概述数据存储数据计算与易用性框架分布式协调服务和任务调度组件数仓架构流处理架构 二、HDFSHDFS 原理总结一、系统架构二、存储机制三、数据写入流程四、心跳机制与集群管理 安全模式&…...
win内核内部直接irp读取文件写入文件
#include <ntifs.h> #include <ntddk.h> #define TAG_NAME tlfF // FltF in reverse #define BUFFER_SIZE PAGE_SIZE // 驱动设备扩展结构 typedef struct _DEVICE_EXTENSION { PDEVICE_OBJECT DeviceObject; UNICODE_STRING DeviceName; UNICODE_STRIN…...
1. 基于图像的三维重建
1. 基于图像的三维重建 核心概念三维重建中深度图、点云的区别？深度图点云总结 深度图到点云还需要什么步骤？1. **获取相机内参**2. **生成相应的像素坐标**3. **计算三维坐标**4. **构建点云**5. **处理颜色信息（可选）**6. **去除…...
如何确保Python爬虫不违反微店规定
在使用Python爬虫获取微店商品详情时，确保爬虫行为符合微店的规定和相关法律法规至关重要。以下是一些关键步骤和注意事项，帮助你合法合规地使用爬虫技术： 一、遵守法律法规 在使用爬虫技术时，必须严格遵守《网络安全法》、《个…...
Spring Event和MQ的区别和使用场景
概念 Spring事件（Spring Event）是Spring框架的一项功能，它允许不同组件之间通过发布-订阅机制进行解耦的通信。 MQ一般是一个独立的中间件，它可以通过消息队列对消息进行传递和存储，生产者将消息发送到MQ，…...
SpringBoot：websocket 实现后端主动前端推送数据
简单说明下websocket实用场景。 实时通信领域：社交聊天弹幕多玩家游戏协同编辑股票基金实时报价体育实况更新视频会议/聊天基于位置的应用在线教育智能家居等需要高实时性的场景 一、服务端代码 pom.xml： <dependencies><dependency><…...
嵌入式硬件篇---PID控制
文章目录 前言第一部分：连续PID1.比例（Proportional，P）控制2.积分（Integral，I）控制3.微分（Derivative，D）控制4.PID的工作原理5..实质6.分析7.各种PID控制器P控…...
小程序获取微信运动步数
1、用户点击按钮，在小程序中触发getuserinfo方法，获取用户信息 <scroll-view class"scrollarea" scroll-y type"list"><view class"container"><button bind:tap"getLogin">获取</button&…...
5G 核心网 相关概念快速入门
在我们开始阅读3GPP协议来学习5G核心网之前， 不妨来看看我之前整理的PPT，快速学习核心网相关概念， 以及5G转发面PFCP协议的相关核心知识。 涵盖了最精简的核心骨干内容，助你轻松上阵。 讲解目标 3GPP和相关协议 5G核心网架构模…...
【2024 年度总结】从小白慢慢成长
【2024 年度总结】从小白慢慢成长 1. 加入 CSDN 的契机2. 学习过程2.1 万事开头难2.2 下定决心开始学习2.3 融入技术圈2.4 完成万粉的目标 3. 经验分享3.1 工具的选择3.2 如何提升文章质量3.3 学会善用 AI 工具 4. 保持初心，继续前行 1. 加入 CSDN 的契机 首次接触…...
SAP POC 项目完工进度 - 收入确认方式【工程制造行业】【新准则下工程项目收入确认】
1. SAP POC收入确认基础概念 1.1 定义与原则 SAP POC（Percentage of Completion）收入确认方式是一种基于项目完工进度来确认收入的方法。其核心原则是根据项目实际完成的工作量或成本投入占预计总工作量或总成本的比例，来确定当期应确认的收…...
vue3+three.js加载glb模型
<template><div><!-- 亮度调节滑块 --><div class"controls"><label for"brightness">背景光亮度：</label><inputtype"range"id"brightness"v-model"brightness"min&quo…...
保姆级教程：在ArcGIS Pro插件中集成你的自定义工具箱（以‘消除重复要素’为例）
从脚本到按钮：ArcGIS Pro插件开发实战指南 在GIS日常工作中，我们常常会遇到一些重复性的数据处理任务。比如数据质检环节的"消除重复要素"操作，虽然可以通过Python脚本实现，但每次都需要打开IDE或Python窗口执行代码&am…...
2026年HR招聘偏好白皮书：这5项附加技能出现频率暴涨
2026 年的招聘市场，正在从“看你会什么岗位技能”，转向“看你能不能把岗位做得更智能”。HR筛简历时，越来越关注候选人的AI应用能力、数据化思维和业务落地能力。人社部近年发布的新职业中，已经出现生成式人工智能系统应用员、人工…...
Vue3 图片标框功能实现方案
基于 Vue3 组合式 API 的图片标框（画框、标注、选框）完整实现，核心逻辑封装在 GetBoxes 组件里，复制就能用 一、功能说明 ✅ 在图片上鼠标拖拽画矩形框 ✅ 实时显示框坐标（x, y, width, height） ✅ 支持多…...
光效崩坏？噪点泛滥？色温漂移？——Midjourney专业级光效渲染全流程校准协议，含ACEScg色彩空间适配模板
更多请点击： https://kaifayun.com 第一章：光效崩坏、噪点泛滥与色温漂移的系统性归因诊断 图像采集链路中出现的光效崩坏、噪点泛滥与色温漂移并非孤立现象，而是光学设计、传感器响应、ISP管线调度及环境耦合失配共同作用的结果。三者常呈现…...
0.2毫秒快速启动的操作系统
在工业控制以及航空航天等核心场景，极速启动就是高可靠系统的生命线。0.2毫秒超快启动搭配硬件看门狗，让设备在掉电重启、异常恢复时瞬时归位，关键任务永不延误！ https://www.bilibili.com/video/BV11mLY6VERt/?spm_id_from333.1…...
第三卷第4章：原型模式设计思想
第三卷第4章：原型模式设计思想 目录介绍 01.案例引入与思考 1.1 痛点场景 1.2 它哪里不舒服 1.3 引出本篇主角 02.原型模式介绍 2.1 原型模式由来 2.2 原型模式定义...
探索Windows 10上的Android世界：揭秘WSA-Windows-10项目的3个技术突破
探索Windows 10上的Android世界：揭秘WSA-Windows-10项目的3个技术突破 【免费下载链接】WSA-Windows-10 This is a backport of Windows Subsystem for Android to Windows 10. 项目地址: https://gitcode.com/gh_mirrors/ws/WSA-Windows-10 想象一下&#…...
INT8量化下TVA注意力对齐精度保障方案
重磅预告：本专栏将独家连载系列丛书《智能体视觉技术与应用》部分精华内容，该书是世界首套系统阐述“因式智能体”视觉理论与实践的专著，特邀美国 TypeOne 公司首席科学家、斯坦福大学博士 Bohan 担任技术顾问。Bohan先生师从美国三院院士、“…...
Taotoken的审计日志功能为企业API安全与合规管理提供支持
🚀 告别海外账号与网络限制！稳定直连全球优质大模型，限时半价接入中。 👉 点击领取海量免费额度 Taotoken的审计日志功能为企业API安全与合规管理提供支持 当企业决定将大模型能力集成到内部业务流程中时，IT管理员和安…...
解决方法：庐山派K230接串口没识别到端口问题
一、插入usb转串口工具之前二、插入usb转串口工具之后三、解决方法说明：🔍 核心原因：USB Serial 设备，没有被识别为 COM 口你现在看到的 USB Serial，说明开发板已经正常启动了，USB 也被电脑识别到了&#x…...