不使用canvs也能创建出点状背景

div{

            height: 100%;

            touch-action: none;

            background: radial-gradient(circle, #e6e6e6 1px, transparent 1px);

            /* 创建一个点状背景 */

            background-size: 15px 15px; /* 控制点的大小和间距 */

            padding: 20px; /* 添加内边距使内容不靠边 */

            position: relative; /* 让内部内容相对定位以在背景上显示 */

     }

 结果:(非常nice)

如果还想要背景颜色可以改为:

div{

           height: 100%;

            touch-action: none;

            background: radial-gradient(circle, #e6e6e6 1px, transparent 1px)  #f5f9fb;

            /* 创建一个点状背景 */

            background-size: 15px 15px; /* 控制点的大小和间距 */

            padding: 20px; /* 添加内边距使内容不靠边 */

            position: relative; /* 让内部内容相对定位以在背景上显示 */

    }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/36929.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

树形DP——AcWing 323. 战略游戏

树形DP 定义 树形动态规划(Tree Dynamic Programming,简称树形DP)是一种在树形结构上应用动态规划算法的技术。它利用树的递归结构,通过定义状态和状态转移方程,来求解与树相关的最优化问题,如树上的最长…

10秒教会你mysql的连接

连接MySQL数据库通常可以通过多种方法实现,以下是几种常见的方法,我将按照您的要求以清晰、分点的方式归纳说明: 1. 使用MySQL命令行客户端 打开终端或命令提示符:首先,打开您的计算机上的终端或命令提示符窗口。输入…

CSS中的display属性:布局控制的关键

CSS的display属性是控制元素在页面上如何显示的核心属性之一。它决定了元素的显示类型,以及它在页面布局中的行为。本文将详细介绍display属性的不同值及其使用场景,帮助你更好地掌握布局控制。 display属性的基本值 block 特点:块级元素&…

LeetCode每日一题 2734.子串操作后的字典序最小字符串|标志位遍历字符数组

问题描述 📋 子串操作后的字典序最小字符串 给定一个仅包含小写字母的字符串,你可以执行如下操作任意次: 选择某个子串,将其中的每个字符都替换成其前一个字母(比如 ‘b’ 变成 ‘a’,‘c’ 变成 ‘b’&…

未来数据中心智能运维的趋势

随着信息技术的飞速发展,数据中心作为支撑企业信息化建设的核心枢纽,其运维管理的重要性日益凸显。传统的运维模式已难以满足现代数据中心高效、安全、灵活的需求,而智能运维正成为行业发展的新趋势。本文将结合运维行业的资料和团队经验&…

【JavaScript 小工具】——如何判断当前页面是否在微信浏览器中打开

要判断用户是否通过微信浏览器打开网页,你可以检查用户代理(User Agent)字符串中是否包含微信浏览器的特定标识。微信浏览器通常会在User Agent中包含"MicroMessenger"这个关键词。 以下是一段JavaScript代码示例,用于…

不使用cmake,如何在vs2019对cpp项目进行文件夹分类?

不使用cmake,如何在vs2019对cpp项目进行文件夹分类? 1.不使用cmake的根目录指的是哪里?2.什么时候进行项目管理?3.应该分成什么样的文件夹?4.如何分类? 1.不使用cmake的根目录指的是哪里? 查看项…

最新AI智能聊天对话问答系统源码(图文搭建部署教程)+AI绘画,文生图,TTS语音识别输入,文档分析

一、人工智能语言模型和AI绘画在多个领域广泛应用 人工智能语言模型和AI绘画在多个领域都有广泛的应用。以下是一些它们的主要用处: 人工智能语言模型 内容生成 写作辅助:帮助撰写文章、博客、报告、剧本等。 代码生成:自动生成或补全代码&…

sudo: /etc/init.d/ssh: command not found

在 WSL 中尝试启动 SSH 服务时遇到 sudo: /etc/init.d/ssh: command not found 错误 安装 OpenSSH 服务器 更新软件包列表 sudo apt update安装 OpenSSH 服务器 sudo apt install openssh-server启动 SSH 服务 在 WSL 2 上,服务管理与传统 Linux 系统有所不同。你可以手动启动…

C++之STL(十)

1、适配器 2、函数适配器 #include <iostream> using namespace std;#include <algorithm> #include <vector> #include <functional>bool isOdd(int n) {return n % 2 1; } int main() {int a[] {1, 2, 3, 4, 5};vector <int> v(a, a 5);cou…

ONLYOFFICE 8.1版本桌面编辑器测评:重塑办公效率的巅峰之作

在数字化办公日益普及的今天&#xff0c;一款高效、便捷且功能强大的桌面编辑器成为了职场人士不可或缺的工具。ONLYOFFICE 8.1版本桌面编辑器凭借其卓越的性能和丰富的功能&#xff0c;成功吸引了众多用户的目光。今天&#xff0c;我们将对ONLYOFFICE 8.1版本桌面编辑器进行全…

使用el-amap-info-window遇到的问题

使用的这个库https://github.com/yangyanggu/vue-amap 想要滚动amapInfoWindow里的内容&#xff0c;但不触发地图缩放 默认滚动amapInfoWindow里的内容&#xff0c;会触发地图缩放。看了C站一个大佬的文章解决了。 amapInfoWindow会自动滚动到顶部 我的amapInfoWindow里面用了…

【智能制造-4】机器人控制器

机器人控制器中分哪几个模块&#xff1f; 机器人控制器通常由以下几个主要模块组成: 运动控制模块: 负责机器人各轴电机的位置、速度、加速度等控制 实现机器人末端执行器的精确定位和运动控制传感器接口模块: 负责机器人各种传感器信号的采集和处理 为运动控制、环境感知等提…

Python-正则表达式

目录 一、打开正则表达式 二、正则表达式的使用 1、限定符 &#xff08;1&#xff09;x*&#xff1a;*表示它前面的字符y 可以有0个或多个&#xff1b; &#xff08;2&#xff09;x&#xff1a;表示它前面的字符可以出现一次以上&#xff1b;&#xff08;只可以匹配多次&…

电镀用开关电源技术详解

1 引言 在电镀行业里&#xff0c;一般要求工作电源的输出电压较低&#xff0c;而电流很大。电源的功率要求也比较高&#xff0c;一般都是几千瓦到几十千瓦。目前&#xff0c;如此大功率的电镀电源一般都采用晶闸管相控整流方式。其缺点是体积大、效率低、噪音高、功率因数低、…

[CocosCreator]CocosCreator网络通信:https + websocket + protobuf

环境 cocos creator版本&#xff1a;3.8.0 开发语言&#xff1a;ts 操作系统&#xff1a;windows http部分 直接使用 XMLHttpRequest 创建http请求 // _getHttpUrl 方法自己写字符串拼接public httpPostJsonRequest(uri: string, headData: any, data: any, cb: Function…

2024年6月大众点评深圳餐饮店铺POI分析18万家

2024年6月大众点评深圳餐饮店铺POI共有178720家 店铺POI点位示例&#xff1a; 店铺id G9TSD2JvdLtA7fdm 店铺名称 江味龙虾馆(南山店) 十分制服务评分 8.8 十分制环境评分 8.8 十分制划算评分 8.6 人均价格 128 评价数量 12840 店铺地址 南山大道与桂庙路交叉口西北角…

微信小程序 点击左上角返回弹窗提示

业务需求&#xff1a;当页面表单没有提交直接返回时&#xff0c;要提示用户是否保存当前信息&#xff0c;如果已经提交就不提示了。 由于微信小程序是无法监听右上角按钮返回事件。 所以就换个思路 小程序提供了如下两个Api wx.enableAlertBeforeUnload(Object object)&…

Python入门-基础知识-编程规范

1.缩进 在编程语言中&#xff0c;代码之间往往存在着一定的逻辑关系和层次关系。C语言和Java语言等 用“{}”分隔代码块&#xff0c;而Python用的是缩进和冒号。Python代码的缩进可以使用空格键或 Tab键来实现&#xff0c;通常情况下以4个空格或1个制表符作为1个缩进量。Pytho…

TCP协议中的三次握手和四次挥手机制

TCP协议中的三次握手和四次挥手机制 TCP&#xff08;Transmission Control Protocol&#xff0c;传输控制协议&#xff09;是一种面向连接的、可靠的、基于字节流的通信协议&#xff0c;它的三次握手和四次挥手机制是建立和断开连接的关键步骤。 三次握手&#xff1a; 第一次…