案例html css
css修改页面内元素的滚动条样式
<div class="box"> <div class="content"></div> </div> <style> .box{ width: 100px; height: 200px; overflow: auto; } .content{ width: 100px; height: 1000 ......
HTML视频背景(动态背景)
网页动态背景一般是用视频实现的，能增添网页的感染力，我觉得很好看，也不难，不妨学一下。 先加入下面一串代码： 1 <style> 2 video{ 3 height: 100%; 4 width: 100%; 5 position: absolute; 6 right: 0px; 7 bottom: ......
css实现 h5滑动时隐藏滚动条
.menus{ margin: 10px 0 ; margin-left: 18px; display: flex; flex-wrap: nowrap; overflow-x: auto; } .menus::-webkit-scrollbar { display: none; width: 0 ......
在chrome下css/js等资源加载缓慢20s+或者30s+
## 问题 chrome、edge等浏览器在打开web网站，部分资源加载缓慢，严重影响体验. ## 在转发nginx上请求和响应时间差距很小，都是30s+ ![image](https://img2023.cnblogs.com/blog/790307/202309/790307-202309071 ......
HTML5超文本链接和文本标签
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document< ......
在Canvas上进行文本输入及其它html元素操作
## 问题 `使用canvas绘制了一个表格，想要在上面进行编辑操作，但canvas并不支持修改操作` ## 思路 `通过给html元素设置绝对定位，遮盖canvas上的指定位置，所有编辑操作都在元素上进行，也可以将元素的值绘制到canvas上，示例demo如下：` 点击查看代码 ``` 编辑 取消 ......
html+css：一个元素多个类，来抽取相同的属性
如下的图像 其三个box的高度是相同的，且具有浮动元素，因此可以作为一个类来把其属性都放在一起 这种合并其实不难理解，但是我们在整体的代码设计中很难考虑这一点，这个一定要记住！！ .child{ height: 200px; float: left; } <div class="box"> <div ......
流程全局引入外部JS、CSS
全局引入，所有流程 E9如果在代码块里面这样： <script type="text/javascript" src="/js/layui-v2.8.13/layui/layui.js"></script> 是引入不了的。 如果想单独在某个流程引入，如下： ......
html+css：“圣杯布局”的设计案例
一、什么是圣杯布局 圣杯布局：左右两个盒子固定宽度， 中间盒子自适应 二、圣杯布局的设计原则： 我们现在来思考自适应这个问题，其本质就是 left 和 right 覆盖一整个大的center， 然后center使用padding把内容左右留出left和right相应的宽度。 可是，现在如何来覆盖呢？ ......
爬虫系统的核心：如何创建高质量的HTML文件？
在网页抓取或爬虫系统中，HTML文件的创建是一项重要的任务。HTML文件是网页的基础，包含了网页的所有内容和结构。在爬虫系统中，我们需要生成一个HTML文件，以便于保存和处理网页的内容。 在这种情况下，可以使用Java函数来实现将爬取到的网页内容保存为HTML文件的功能。具体来说，当爬虫系统获取到需 ......
跑马灯(文字和图片轮播)效果纯css实现
1. 文字和图片连续轮播 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>文字和图片连续轮播</title> <style> * { margin: 0; padding: 0; } body{ text-align: cent ......
html+css：滑动门的设计案例
一、什么是滑动门布局？ 其代码效果如下所示，其不管中间的文字多长，其图片都可以包含进去！！ 二、如何实现滑动门布局？ 首先，我们通过背景图片，通过 <a> <span> 关于我们 </span> <a> 这种来将内容包裹进去。 然后对a进行 background-img 左边，然后对span进行 b ......
spring整合junit中使用到的依赖以及简单的测试案例演示
2023-09-07 注意：spring整合junit中的依赖要和spring-context的依赖版本相一致 <dependency> <groupId>junit</groupId> <artifactId>junit</artifactId> <version>4.13.2</version> ......
Spring Boot项目手动提交事务案例
# Spring Boot项目手动提交事务案例 ``` java // 注入 PlatformTransactionManager 对象，用于管理事务 @Resource private PlatformTransactionManager transactionManager; public vo ......
Windows服务器使用IIS部署html页面
如果用的是Linux相同的话 把前端部署上去 你就是直接把本地的文件cv过去就行了 页面的ip就是你服务器的ip 但是在windows系统上 就不行 你要自己配置一个公网ip 配置步骤如下: 双击打开服务器 然后就可以了 然后这边启动你刚刚配置的项目 出现这个页面 解决办法 找到这个应用程序 改为t ......
html+css：padding与margin的应用场景，以及margin上边框合并问题
一、一个困扰自己长久的问题 padding 和 margin 其似乎可以实现相同的效果，但是纠结使用哪一个。 现在一个规定： 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内嵌关系，则使用padding来调整，若是并列关系，则使用margin来调整！ 若是内 ......
js_js&css 导入形式
href: <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="stylesheet" href="./css/font.css"> <link rel="stylesheet" href=" ......
CSS 自定义checkbox样式
小星星 /**checkbox 样式 begin*/ .chkAuto { width: 10px; height: 10px; } .auto_check input[type="checkbox"] + label::before { content: " "; display: inline- ......
CSS radio自定样式
出来是彩色的 radio button .rdo_enabled { vertical-align: middle; margin-top: 5px; font-size: 25px; transform: scale(2); line-height: 60px; background-color: ......
html+css：<a>中嵌入<img>，实现图片链接
这个很好理解，记住 <a> 中不仅可以写标签，还可以嵌入文字。 现在效果如下，在<a>中嵌入了<img>，同时又嵌入了<p>，点击图片和文字段落，其都会直接来进行跳转。 这个是非常重要的，一点也不难，耐心做下去。 ......
html+css：文章居中，图片居中
我们平常要涉及很多居中，现在这个要理解 一、文字内容居中 如下，其宽度居中采用text-align，但其高度居中，则让块高度，和行高度保持一致，此时就可以实现宽度居中 二、图片居中于浏览器，img作为行内块元素是无法实现的！ img作为行内块元素，其有行的性质，此时 margin 是没有效果的，如下 ......
html+css：padding + content 才是盒子的内容大小
这个要知道，我们有padding，这个padding指的是内容（举个例子，背景颜色就不属于内容）。 我们在计算内容的宽高时要记住，如下图的对比，padding的这个要理解 ......
html+css：深入理解 background-img 和 img区别
这俩 background-img 和 img，在图片布局时，我们经常用到，但我们有时很难理解其区别。 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，background-img，其作为背景，图片大小本身无法决定内容的大小！！ 简单来说，backg ......
html+css：深入理解“块级元素”、“行内元素”和“行内块”元素
“块级元素”、“行内元素”和“行内块”元素，理解这个，才能深入理解css的盒子模型，这个是非常重要的。 其关键是“宽高”，理解“宽高”，“宽高”，“宽高”！！！ 这个是其根本区别，行内元素是由内容撑开，给宽高不起作用！！ 一、行内元素只记住 span 和 a 元素即可 如下，什么 dd,dt都是块级 ......
自己编写一个发get请求案例
#在线用户的文件夹  ##上一篇的咨询在线用户列表  { const targetDom = document.getElementById(`imag ......
用户案例 | 蜀海供应链基于 Apache DolphinScheduler 的数据表血缘探索与跨大版本升级经验
 ## 导读 蜀海供应链是集销售、研发、采购、生产、品保、仓储、运输、信息、金融为一体的餐饮供应链服务企 ......
mybatis类型转换。TypeHandler案例
配置 mybatis-plus: configuration: map-underscore-to-camel-case: true cache-enabled: false global-config: db-config: column-underline: true db-type: mysq ......