CSS关于默认宽度
所谓的默认宽度，就是不设置width属性时，元素所呈现出来的宽度
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}.box {/* 设置了高度没有设置宽度 */height: 100px;background-color: red;}</style>
</head>
<body><div class="box"></div>
</body>
</html>
效果图：
如果我们设置了margin值
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}body {background-color: black;}.box {/* 设置了高度没有设置宽度 */height: 200px;margin: 100px;background-color: red;}</style>
</head>
<body><div class="box"></div>
</body>
</html>
效果图：
我们设置padding试一试
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}body {background-color: black;}.box {/* 设置了高度没有设置宽度 */height: 200px;padding: 0 100px;background-color: red;font-size: 20px;}</style>
</head>
<body><div class="box">11111111111111111111111111111111111111111111</div>
</body>
</html>
我们发现内容区被撑开了
小结一下：
总宽度 = 父的 content — 自身的左右margin
内容区的宽度 = 父的 content — 自身的左右margin — 自身的左右 border — 自身的左右padding
感谢大家的阅读，如有不对的地方，可以向我提出，感谢大家！
相关文章：
CSS关于默认宽度
所谓的默认宽度，就是不设置width属性时，元素所呈现出来的宽度 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title></title><style>* {margin: 0;padding: 0;}.box {/…...
JDBC（二）
第4章 操作BLOB类型字段 4.1 MySQL BLOB类型 MySQL中，BLOB是一个二进制大型对象，是一个可以存储大量数据的容器，它能容纳不同大小的数据。 插入BLOB类型的数据必须使用PreparedStatement，因为BLOB类型的数据无法使用字符串拼接写…...
LeetCode----149. 直线上最多的点数
题目 给你一个数组 points ，其中 points[i] [ x i x_i xi, y i y_i yi] 表示 X-Y 平面上的一个点。求最多有多少个点在同一条直线上。 示例 1： 输入：points [[1,1],[2,2],[3,3]] 输出：3 示例 2： 输入…...
19、Flink 的Table API 和 SQL 中的自定义函数及示例（3）
Flink 系列文章 1、Flink 部署、概念介绍、source、transformation、sink使用示例、四大基石介绍和示例等系列综合文章链接 13、Flink 的table api与sql的基本概念、通用api介绍及入门示例 14、Flink 的table api与sql之数据类型: 内置数据类型以及它们的属性 15、Flink 的ta…...
Flutter IOS 前后台切换主题自动变化的问题
BUG 触发条件 设备 IOS 15 模拟器GetX 实现换肤GetMaterialApp 里面配置好 theme和darkTheme使用GetView和GetController进行开发 此时如果把App前后台切换，使用Obx包括起来的内容会跟谁异常主题变换，未使用Obx的颜色不会变化。 解决路径 首先在获取 …...
rabbitmq入门学习
写在前面 本文看下rabbit mq的基础概念以及使用。 1：简单介绍 为了不同进程间通信的解耦，出现了消息队列，为了规范消息队列的具体实现，Java制定了jms规范，这是一套基于接口的规范，因此是绑定语言的&…...
说说对Fiber架构的理解？解决了什么问题？
一、问题 JavaScript引擎和页面渲染引擎两个线程是互斥的，当其中一个线程执行时，另一个线程只能挂起等待 如果 JavaScript 线程长时间地占用了主线程，那么渲染层面的更新就不得不长时间地等待，界面长时间不更新，会导…...
Spring Security笔记
Spring Security 是 Spring家族中的一个安全管理框架。 一般来说中大型的项目都是使用 SpringSecurity 来做安全框架，小项目用相对简单的Shiro。认证、授权是 SpringSecurity 作为安全框架的核心功能。 认证：通过用户名密码验证当前访问系统的是不是本…...
快速教程｜如何在 AWS EC2上使用 Walrus 部署 GitLab
Walrus 是一款基于平台工程理念的开源应用管理平台，致力于解决应用交付领域的深切痛点。借助 Walrus 将云原生的能力和最佳实践扩展到非容器化环境，并支持任意应用形态统一编排部署，降低使用基础设施的复杂度，为研发和运维团队提供…...
[vmware]vmware虚拟机压缩空间清理空间
vmware中的ubuntu使用如果拷贝文件进去在删除，vmare镜像文件并不会减少日积月累会不断是的真实物理磁盘空间大幅度减少，比如我以前windows操作系统本来只有30GB最后居然占道硬盘200GB，清理方法有2种。 第一种：vmware界面操作 第二…...
一篇文章带你使用（MMKV--基于 mmap 的高性能通用 key-value 组件）
一、MMKV是什么？ MMKV 是基于 mmap 内存映射的 key-value 组件，底层序列化/反序列化使用 protobuf 实现，性能高，稳定性强。也是腾讯微信团队使用的技术。 支持的数据类型 支持以下 Java 语言基础类型： boolean、int…...
Pytorch 里面torch.no_grad 和model.eval(), model.train() 的作用
torch.no_grad: 影响模型的自微分器，使得其停止工作；这样的话，数据计算的数据就会变快，内存占用也会变小，因为没有了反向梯度计算，当然，我哦们也无法做反向传播。 model.eval() 和model.train()…...
Ozon产品内容评级功能上线，妙手ERP实力助力Ozon卖家全方位打造爆款产品！
产品内容评级，可以直接反映产品质量的高低，也是影响产品排名的关键。具有较高内容评级的产品，将有更大机会显示在搜索结果和类目的前几页中，从而引起买家的关注，促进销售。 为帮助卖家打造高质量产品，妙手…...
Linux 下最主流的文件系统格式——ext
硬盘分成相同大小的单元，我们称为块（Block）。一块的大小是扇区大小的整数倍，默认是 4K。在格式化的时候，这个值是可以设定的。 一大块硬盘被分成了一个个小的块，用来存放文件的数据部分。这样一来…...
变量环境、变量提升和暂时性死区
JavaScript中的提升 在JavaScript中，“Hoisting”（提升）是一种特性，它将变量和函数的声明移动到作用域的顶部。这意味着可以在声明之前使用这些变量和函数，而不会报错。 当JavaScript代码执行时，会经过两个…...
yolov8+多算法多目标追踪+实例分割+目标检测+姿态估计（代码+教程）
多目标追踪实例分割目标检测 YOLO (You Only Look Once) 是一个流行的目标检测算法，它能够在图像中准确地定位和识别多个物体。 本项目是基于 YOLO 算法的目标跟踪系统，它将 YOLO 的目标检测功能与目标跟踪技术相结合，实现了实时的多目标跟…...
【神经网络】【GoogleNet】
1、引言 卷积神经网络是当前最热门的技术，我想深入地学习这门技术，从他的发展历史开始，了解神经网络算法的兴衰起伏；同时了解他在发展过程中的**里程碑式算法**，能更好的把握神经网络发展的未来趋势，了解神…...
网络安全深入学习第八课——正向代理（工具：ReGeorg）
文章目录 一、环境配置二、开始模拟1、拿下跳板机的Webshell权限，并上传shell文件1.1、查看跳板机网络环境1.2、查看arp表 2、使用ReGeorg来建立连接2.1、生产ReGeorg隧道文件2.2、上传ReGeorg隧道的PHP脚本到跳板机2.3、连接隧道2.4、尝试浏览器连接 3、使用Proxif…...
Jmeter全流程性能测试实战
项目背景： 我们的平台为全国某行业监控平台，经过3轮功能测试、接口测试后，98%的问题已经关闭，决定对省平台向全国平台上传数据的接口进行性能测试。 01、测试步骤 1、编写性能测试方案 由于我是刚进入此项目组不久，…...
Python算法例8 将整数A转换为B
1. 问题描述 给定整数A和B，求出将整数A转换为B，需要改变bit的位数。 2. 问题示例 把31转换为14，需要改变2个bit位，即：（31）10（11111）2，（14&…...
一个基于百度飞桨封装的.NET版本OCR工具类库 - PaddleOCRSharp
前言 大家有使用过.NET开发过OCR工具吗？今天给大家推荐一个基于百度飞桨封装的.NET版本OCR工具类库：PaddleOCRSharp。 OCR工具有什么用？ OCR（Optical Character Recognition）工具可以将图像或扫描文件中的文本内容转…...
在 CelebA 数据集上训练的 PyTorch 中的基本变分自动编码器
摩西西珀博士 一、说明 我最近发现自己需要一种方法将图像编码到潜在嵌入中，调整嵌入，然后生成新图像。有一些强大的方法可以创建嵌入或从嵌入生成。如果你想同时做到这两点，一种自然且相当简单的方法是使用变分自动编码器。 这样的深度网络不…...
利用Ansible实现批量Linux服务器安全配置
1.摘要 在上一篇<<初步利用Ansible实现批量服务器自动化管理>>文章中, 我初步实现了通过编写清单和剧本来实现多台服务器的自动化管理,在本章节中, 我将利用Ansible的剧本来实现更实用、更复杂一点的功能, 主要功能包括三个:1.同时在三台服务器中增加IP访问控制,只…...
读书笔记：彼得·德鲁克《认识管理》第8章 战略规划：企业家技能
一、章节内容概述 战略规划帮助做好当前的业务以迎接未来。战略规划需要思考业务应该是什么，当前必须做什么才能赢得未来。战略规划需要进行风险决策，需要有组织地抛弃过去的业务，要求清晰界定和明确安排为实现理想的未来而开展的工作。战略…...
HarmonyOS应用开发-视频播放器与弹窗
Viedo组件 在手机、平板或是智慧屏这些终端设备上，媒体功能可以算作是我们最常用的场景之一。无论是实现音频的播放、录制、采集，还是视频的播放、切换、循环，亦或是相机的预览、拍照等功能，媒体组件都是必不可少的。以视频功能为…...
java中对象的引用是什么？
引用和指向 例如： new Student(); 代表创建了一个Student对象，但是也仅仅是创建了一个对象，没有办法访问它。 为了访问这个对象，会使用引用来代表这个对象 Student s new Student(); s这个变量是Student类型，又叫做引…...
jenkins插件迁移
将Jenkins插件迁移至不同的Jenkins实例或更新插件版本是一项常见的任务。以下是迁移Jenkins插件的一般步骤： 备份现有插件： 在开始迁移之前，首先备份你当前的Jenkins实例以及所有相关的插件。这可以通过复制Jenkins的JENKINS_HOME目录来实现…...
RK356X Android13.0 HDMI和喇叭同时出声音
补丁适用范围：RK356X Android13.0 Android默认音频输出逻辑，不接HDMI默认喇叭音频输出，若检测到HDMI接入后，关闭喇叭输出，开启HDMI音频输出，但是BOX产品的使用场景需要插入HDMI后，喇叭仍然输出，可加入此补丁 $ vim frameworks/base/services/core/java/com/android/s…...
vue sass-loader,webpack安装卸载操作命令
检查 node-sass 的可用版本：运行下面的命令，查看 node-sass 的可用版本列表。 查看 npm view node-sass versions卸载 npm uninstall node-sass安装指定版本 npm install node-sass4.14.1安装最新版本 npm install sass-loaderlatest如果没有指定特定…...
nacos应用——占用内存过多问题解决（JVM调优初步）
问题描述 最近搞了一台1年的阿里云服务器，安装了一下常用的MySQL，Redis，rabbitmq，minio，然后有安装了一下nacos，结果一启动nacos内存占用就很高，就比较限制我继续安装其他镜像或者启动别的服务…...