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

002-Html

news 2025/12/25 20:24:24

Html

一、常用样式
- - - - 1.设置滚动条
        2.设置省略号
        3.设置高度自适应
        4.高度算法
        5.按钮样式
        6.按钮颜色
二、DIV
- - - - 1.并排显示
三、Input
- - - - 1.漂浮显示

一、常用样式

1.设置滚动条

<html>
<!--滚动条-->overflow: auto; // x 和 yoverflow-x: auto; // xoverflow-y: auto; // y
</html>

2.设置省略号

<html>
<!--省略号-->text-overflow: ellipsis;
white-space: nowrap;</html>

3.设置高度自适应

<html>
<!--高度自适应-->height: auto;	white-space:normal; word-break:break-all;overflow:hidden;</html>

4.高度算法

<html>
<!--高度算法-->采用算法，加减补齐height=100%height: calc(100vh - 55px)style="height: calc(100% - 35px);"overflow: auto;</html>

5.按钮样式

<html>
<!--按钮样式-->1、下载<el-button circle title="下载模板" @click="downloadExcel"><i class="fa fa-download" aria-hidden="true"/></el-button>2、上传<el-button circle title="导入" @click="importData"><i class="fa fa-upload"></i></el-button>3、新增/添加设备/添加物资<el-button circle title="新增" @click="onCommentAdd('commentForm')"><i class="fa fa-plus" aria-hidden="true"/></el-button>4、修改<el-button circle title="修改" @click="updateStock()"><i class="fa fa-pencil"></i></el-button>5、删除<el-button circle title="删除" @click="deleteStock()"><i class="fa fa-trash"></i></el-button>6、保存<el-button circle  title="保存" @click="saveStock('form')"><i class="fa fa-file-text-o"></i></el-button>7、返回<el-button circle title="返回" @click="onCancel"><i class="el-icon-back" aria-hidden="true"/></el-button>8、取消<el-button circle  title="取消" @click="onCancel"><i class="fa fa-times"></i></el-button>9、打印<el-button circle  title="打印" @click="print"><i class="fa fa-print"> </i></el-button>10、审核/提交<el-button circle title="审核" @click="checkStock()"><i class="fa fa-check"></i></el-button>*************************************************************************
弹窗：浓厚：<el-button type="success" size="mini" @click="load"><i class="el-icon-search">查询</i></el-button><el-button type="warning" @click="resetSearch"><i class="el-icon-refresh">重置</i></el-button><div slot="footer" class="dialog-footer" style="text-align: right;margin-top: 38px;margin-right: 5px;"><el-button @click="cancelMaterial">取 消</el-button><el-button type="primary" @click="getAllMaterial">确 定</el-button></div>清淡：<el-button plain type="primary" @click="fetchData"><i class="el-icon-search">搜索</i></el-button><el-button plain type="warning" @click="resetSearch"><i class="el-icon-refresh">重置</i></el-button><div slot="footer" class="dialog-footer" style="text-align: right;margin-top: 5px;margin-right: 5px;"><el-button plain size="mini" @click="cancelMaterial">取 消</el-button><el-button plain size="mini" type="primary" @click="getAllMaterial">确 定</el-button></div></html>

6.按钮颜色

<html>
<!--按钮颜色--><input type="button" value="添加" class="btn btn-success" @click="add">按钮对应的class为：
灰白色：btn
浅蓝色：btn btn-primary
天蓝色：btn btn-info
深绿色：btn btn-success
菊黄色：btn btn-warning
深红色：btn btn-danger
黑  色：btn btn-inverse</html>

二、DIV

1.并排显示

<html>
在HTML中让两个div并排显示bai，通常情况下有三种实现方式，du包括:（1）设置为行内样式，display:inline-block（2）设置float浮动（3）设置position定位dao属性为absolute以下为三种方式的具体实现代码：1、设置每个div的展现属性为行内样式，示例代码为：<div class="app"><div style="display:inline-block;background:#f00;">div1</div><div style="display:inline-block;background:#0f0;margin-left:10px;">div2</div></div>2、设置float浮动，示例代码为：<div class="app"><div style="float:left;background:#f00;">div1</div><div style="float:left;background:#0f0;margin-left:10px;">div2</div></div>3、设置position定位属性为absolute, 示例代码为：<div class="app"><div style="position: absolute;width:100px;background:#f00;">div1</div><div style="position: absolute;left:100px;background:#0f0;margin-left:10px;">div2</div></div>扩展资料：css清除浮动方法（1）添加新的元素 、应用 clear：both.clear {clear: both; height: 0;
height: 0;overflow: hidden;
}（2）父级div定义 overflow: auto.over-flow {overflow: auto;
zoom: 1; //处理兼容性问题}（3）伪类  :after 方法  outer是父div的样式.outer { zoom:1; }    /*==for IE6/7 Maxthon2==*/.outer :after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden; }
</html>

三、Input

1.漂浮显示

<html><!-- title --><input  onmouseover="this.title=this.value"/> 如果input里面的内容固定,或者悬浮显示div里面的文字,需要悬浮显示,可以直接写为<input  title="这个是悬浮显示的文字"/> ,<div title="这个是悬浮显示的文字"></div>vue中悬浮的内容是变化的，可以用  :  绑定数据<el-input :title="item.value" v-model="item.value" :disabled="disabledYanqi"></el-input>
</html>

002-Html

Html 一、常用样式1.设置滚动条2.设置省略号3.设置高度自适应4.高度算法5.按钮样式6.按钮颜色二、DIV1.并排显示三、Input1.漂浮显示一、常用样式 1.设置滚动条 <html> overflow: auto; // x 和 yoverflow-x: auto; // xoverflow-y: auto; // y …...

编程日记 2024/10/16 6:18:58

微知-Mellanox提供的一个不错的测试rdma_cm方式建链的工具软件ucmatose？(ucmatose； ucmatose -s 1.1.1.1)

文章目录快速命令获取背景实验server端客户端一个错误的情况无法建链： rpm安装包：librdmacm-utils-48.0-1.0.1.an8.x86_64详细介绍综述快速命令获取 #server端 ucmatose# client端 ucmatose -s 1.1.1.1背景平时使用rdma cm建链的测试一般使用ib_wri…...

编程日记 2024/10/16 6:16:56

简单的led.cpp,led.h,还有一个test bench文件xxxx.cpp source D:/Vivado_HLS_project/RGB_YCBCR_RGB/solution1/sim/verilog/xsim.dir/flash_led/webtalk/xsim_webtalk.tcl -notraceINFO: [Common 17-206] Exiting Webtalk at Tue Oct 15 18:51:42 2024... INFO: [Common 17-2…...

编程日记 2024/10/16 6:15:54

Python实现图像加密与解密工具

Python实现图像加密与解密工具一、整体思路加密思路读取图像文件，将图像数据转换为可以处理的格式（例如字节流）。选择一种加密算法，如AES（Advanced Encryption Standard）对称加密算法。生成加密密钥&a…...

编程日记 2024/10/16 6:14:53

《RabbitMQ篇》消费者轮询消费消息

当有多个消费者都在同一个队列中拿取消息时，会轮询从队列中拿取消息消费。 RabbitMQUtil类为工具类，获取Channel。 import com.rabbitmq.client.Channel; import com.rabbitmq.client.Connection; import com.rabbitmq.client.ConnectionFactory;public…...

编程日记 2024/10/16 6:12:51

mongodb导入导出

分享自己mongodb导出导入经验。将一个数据库数据备份，导入到另一个数据库。 mongodb的导入导出工具有版本限制，过旧的版本是不支持导入导出的。mongodb 4.2以后版本支持比较好。mongodb 3.4以前完全不支持。 1，下载 mongodb的导入导出需要自…...

编程日记 2024/10/16 6:10:50

判断 HTTP/2 多路复用是否在服务器上实现

要判断 HTTP/2 多路复用是否在服务器上实现，并确保浏览器正在使用多路复用来加载资源，您可以使用以下几种方法进行验证： 1. 使用浏览器开发者工具大多数现代浏览器（如 Chrome、Firefox、Edge）提供了开发者工具&…...

编程日记 2024/10/16 6:06:47

(已解决)vscode使用launch.json进行debug调试报错：Couldn‘t spawn debuggee:embedded null byte

Launch.json 进行debug时报错： 主要原因是vscode全局配置被整乱了，下面是个人解决的方法，以供参考. 在网上也寻找过解决方法，有的说是，在launch.json中，添加一行"python":"/root/miniconda3…...

编程日记 2024/10/16 6:05:45

windows桌面便签小工具，便签软件哪个好用？

我们都知道，Windows桌面便签小工具可以极大地提高工作效率，帮助我们快速记录重要信息或待办事项。至于便签软件哪个好用，在选择便签软件时，我们可以从以下几个方面来考量：易用性、功能性、安全性以及是否支持跨平台同步…...

编程日记 2024/10/16 6:04:44

【Linux】C文件头文件数裁剪前58644个，裁剪后9373个

裁剪后可以访问网络和从Windows共享的文件夹： 纯C代码编译（不包含打包）时长比较：未裁剪前：大约5.5小时，裁剪后大约35分钟。 C文件和头文件数量比较（目录里边实际还有tools和scripts目录&#xf…...

编程日记 2024/10/16 6:03:43

线性自抗扰控制(LADRC)系统算法框图

非线性ADRC(NLADRC）详细算法框图和源代码请参考专栏系列文章，常用链接如下： 1、NLADRC自抗扰控制 NLADRC自抗扰控制从Simulink仿真到PLC控制实现_自抗扰控制器 simulink仿真-CSDN博客文章浏览阅读1.6k次，点赞2次，收藏7次。本文介绍了如何将ADRC自抗扰控制算法从Simulink…...

编程日记 2024/10/16 6:02:42

基于SSM的微信小程序博客管理系统（博客1)

👉文末查看项目功能视频演示获取源码sql脚本视频导入教程视频 1、项目介绍基于SSM的微信小程序博客管理系统实现与设计，实现了管理员与用户，管理员实现了用户管理、博文信息管理、博文类型管理、我的博文管理、个人名片分享管理、签到管理…...

编程日记 2024/10/16 5:57:36

text-behind-image：轻松创建文字背景图片设计

在网页设计中，视觉效果往往能够极大地提升用户体验。其中，将文字置于图片背后是一种常见的设计手法，可以增加页面的层次感和视觉吸引力。今天，我将向你介绍一个名为 text-behind-image 的JavaScript库，它可以让你轻松实…...

编程日记 2024/10/16 5:54:34

前端reactvue3——实现滚动到底加载数据

文章目录 ⭐前言⭐react 实现滚动加载⭐vue3 实现滚动加载⭐总结⭐结束 ⭐前言大家好，我是yma16，本文分享前端react&vue3——实现滚动加载（到底部加载） scrollTop 属性一个双精度浮点值，表示元素当前从原点垂直…...

编程日记 2024/10/16 5:52:32

qt 安装提示无法定位程序输入点 systemparametersinfofordpi于动态链接库

安装 qt-creator-opensource-windows-x86_64-14.0.2.exe 有以下提示无法定位程序输入点 systemparametersinfofordpi于动态链接库路径 qt-creator-opensource-windows-x86_64-14.0.2.exe 更新系统平台win10 很久之前的版本，关闭了更新，更新到 Win…...

编程日记 2024/10/16 5:48:27

算法笔记day04

目录 1. 在字符串中找出连续最长的数字串 2.岛屿数量 3.拼三角 1. 在字符串中找出连续最长的数字串字符串中找出连续最长的数字串_牛客题霸_牛客网 (nowcoder.com) 算法思路： 这是一道简单的双指针题目，首先用i遍历数组，当遍历到数字的时…...

编程日记 2024/10/16 5:47:26

实战篇：（四）Vue2 + Three.js 创建可交互的360度全景视图，可控制旋转、缩放完整代码

Vue2 Three.js 创建可交互的360度全景视图，可控制旋转、缩放引言在现代网页开发中，三维图形技术已经成为提升用户体验的重要工具。本文将展示如何使用 Three.js 创建一个简单的可交互360度全景视图。通过这一项目，你将能够学习到基本的场…...

编程日记 2024/10/16 5:42:21

【load_file读文件】

一、文件操作基础 show 先试试 show variables;发现显示了三百多行的系统变量: 这是数据库的目录： mysql有多种编码方式，有数据库编码、连接时的编码、还有客户端的编码： 这里还有一个日志路径，这个日志是需要手动打开的&#…...

编程日记 2024/10/16 5:40:18

JavaScript object(2)

这样的话，就变成只读了。...

编程日记 2024/10/16 5:38:16

Acwing 排序

1.快速排序主要思想：基于分治思想。通过选择一个基准元素，将数组分为两部分，左边部分元素都小于等于基准，右边部分元素都大于等于基准。然后对这两部分分别递归地进行排序。分区逻辑：双指针算法左指针i从左往右找…...

编程日记 2024/10/16 5:37:15

全球首个30米分辨率湿地数据集(2000—2022)

数据简介今天我们分享的数据是全球30米分辨率湿地数据集，包含8种湿地亚类，该数据以0.5X0.5的瓦片存储，我们整理了所有属于中国的瓦片名称与其对应省份，方便大家研究使用。该数据集作为全球首个30米分辨率、覆盖2000–2022年时间…...

编程新知 2025/12/21 6:19:19

【C语言练习】080. 使用C语言实现简单的数据库操作

080. 使用C语言实现简单的数据库操作 080. 使用C语言实现简单的数据库操作使用原生APIODBC接口第三方库ORM框架文件模拟1. 安装SQLite2. 示例代码：使用SQLite创建数据库、表和插入数据3. 编译和运行4. 示例运行输出：5. 注意事项6. 总结080. 使用C语言实现简单的数据库操作在…...

编程新知 2025/9/22 21:37:01

【碎碎念】宝可梦 Mesh GO : 基于MESH网络的口袋妖怪宝可梦GO游戏自组网系统

目录游戏说明《宝可梦 Mesh GO》 —— 局域宝可梦探索Pokmon GO 类游戏核心理念应用场景Mesh 特性宝可梦玩法融合设计游戏构想要素1. 地图探索（基于物理空间广播范围）2. 野生宝可梦生成与广播3. 对战系统4. 道具与通信5. 延伸玩法安全性设计技术选…...

编程新知 2025/12/12 6:01:17

AspectJ 在 Android 中的完整使用指南

一、环境配置（Gradle 7.0 适配） 1. 项目级 build.gradle // 注意：沪江插件已停更，推荐官方兼容方案 buildscript {dependencies {classpath org.aspectj:aspectjtools:1.9.9.1 // AspectJ 工具} } 2. 模块级 build.gradle plu…...

编程新知 2025/7/7 22:33:57

算法笔记2

1.字符串拼接最好用StringBuilder，不用String 2.创建List<>类型的数组并创建内存 List arr[] new ArrayList[26]; Arrays.setAll(arr, i -> new ArrayList<>()); 3.去掉首尾空格...

编程新知 2025/12/24 22:45:27

回溯算法学习

一、电话号码的字母组合 import java.util.ArrayList; import java.util.List;import javax.management.loading.PrivateClassLoader;public class letterCombinations {private static final String[] KEYPAD {"", //0"", //1"abc", //2"…...

编程新知 2025/12/15 11:08:22

[免费]微信小程序问卷调查系统(SpringBoot后端+Vue管理端)【论文+源码+SQL脚本】

大家好，我是java1234_小锋老师，看到一个不错的微信小程序问卷调查系统(SpringBoot后端Vue管理端)【论文源码SQL脚本】，分享下哈。项目视频演示【免费】微信小程序问卷调查系统(SpringBoot后端Vue管理端) Java毕业设计_哔哩哔哩_bilibili 项…...

编程新知 2025/12/21 14:10:00

深度剖析 DeepSeek 开源模型部署与应用：策略、权衡与未来走向

在人工智能技术呈指数级发展的当下，大模型已然成为推动各行业变革的核心驱动力。DeepSeek 开源模型以其卓越的性能和灵活的开源特性，吸引了众多企业与开发者的目光。如何高效且合理地部署与运用 DeepSeek 模型，成为释放其巨大潜力的关键所在&…...

编程新知 2025/11/6 2:17:56

多元隐函数偏导公式

我们来推导隐函数 z z ( x , y ) z z(x, y) zz(x,y) 的偏导公式，给定一个隐函数关系： F ( x , y , z ( x , y ) ) 0 F(x, y, z(x, y)) 0 F(x,y,z(x,y))0 🧠 目标： 求 ∂ z ∂ x \frac{\partial z}{\partial x} ∂x∂z、 …...

编程新知 2025/9/19 5:31:38

起重机起升机构的安全装置有哪些？

起重机起升机构的安全装置是保障吊装作业安全的关键部件，主要用于防止超载、失控、断绳等危险情况。以下是常见的安全装置及其功能和原理： 一、超载保护装置（核心安全装置） 1. 起重量限制器功能：实时监测起升载荷&a…...

编程新知 2025/11/12 16:14:48