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

模拟开发小鹅通首页网站练习

HTML代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>小鹅通-首页</title><!-- 引入页面样式 --><link rel="stylesheet" href="./css/style.css"><link rel="stylesheet" href="./css/index.css">
</head><body><!-- 页头banner图 --><div class="bg header"><!-- 页头导航 --><div class="nav"><div class="content"><!-- 左侧菜单 --><div class="nav-menus"><div class="logo"></div><ul><li><a href="#">首页</a></li><li><a href="#">解决方案</a></li><li><a href="#">产品服务</a></li><li><a href="#">价格</a></li><li><a href="#">活动</a></li><li><a href="#">案例</a></li><li><a href="#">渠道合作</a></li><li><a href="#">下载与帮助</a></li><li><a href="#">关于我们</a></li></ul></div><!-- 右侧登录 --><div class="nav-login"><div>我是学员</div><div>商家登录</div><div>免费试用</div></div></div></div><!-- banner图 --><div class="banner"></div></div><!-- 产品介绍 --><div class="bg intro"><h1>我们的产品能力</h1><img src="./images/m3moa2m10v5k.webp" alt=""><div class="info"><div><h3 class="title active">知识店铺</h3><p>1分钟搭建您的知识商城<br>助力高效知识变现</p><a href="#">免费试用 - &rightarrow;</a></div><div><h3 class="title">私域直播</h3><p>企业级专属私域直播平台<br>实现私域流量高效运营</p><a href="#">免费试用 - &rightarrow;</a></div><div><h3 class="title">企微SCRM</h3><p>企业微信私域运营神器<br>数据洞察驱动业绩增长</p><a href="#">免费试用 - &rightarrow;</a></div></div></div><!-- sence --><div class="bg sence"><h1>我们的场景解决方案</h1><ul class="list"><li>公域获客</li><li>私域运营</li><li>直播带货</li><li>内容交付</li><li>数据化运营</li></ul><div class="info"><img src="./images/m10c72vn0zzo.webp" alt=""><div class="msg"><h2>公域获客</h2><h3>多渠道获客,沉淀私域流量池</h3><ul><li>打通抖音/快手/小红书/视频号/公众号,支持直播间/短视频/账号主页等多种课程挂载方式,快速开启知识变现</li><li>多种公域转私域工具,支持添加企微/引流加群加人/渠道活码/分配引擎等工具,客户可批量导流到私域流量池</li><li>丰富的广告获客能力,落地页支持表单/支付类/0元领取/添加企微等多场景,提升广告ROI</li></ul><div class="btns"><div>免费试用</div><div>了解详情</div></div></div></div></div><!-- 行业解决方案 --><div class="bg industry"><h1>我们的行业解决方案</h1><div class="he"><div class="zuo"><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" width="18.59px" height="18.59px"><span style= "margin-left:8px">新零售门店</span></div><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" width="18.59px" height="18.59px"><span style= "margin-left:8px">职业培训</span></div><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" width="18.59px" height="18.59px"><span style= "margin-left:8px">知识付费</span></div><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" width="18.59px" height="18.59px"><span style= "margin-left:8px">美业直播</span></div><!--span局部标签,修饰网页中一**行内的部分内容--><!-- img : 图片标签名称,主要网页中显示图片src属性:显示图片的路径(网址、本地路径、图片数据)width属性:设置图片宽度,一般推荐以像素为单位height属性:设置图片高度,一般推荐以像素为单位宽度和高度设置任意一个数据,图片等比例缩放;两个属性都设置-图片拉伸alt属性:当图片无法正常显示时替代的文字描述--></div><div class="zhuong"><h2>知识付费行业解决方案</h2><p>提供内容变现能力,助力品牌IP打造</p><div class="msg"><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" alt=""><span>知识店铺</span></div><div>专栏</div><div>会员</div><div>圈子</div><div>直播</div><div>表单</div><div>裂变海报</div><div>推广员</div></div><!--按 Shift + Alt + 上/下方向键,可以直接复制一行代码--><div class="btns"><div>免费试用</div><div>了解详情</div></div></div><div class="you"><h4>行业案例</h4><div><img src="./images/e97a1e6be8d332de218eba53001b301.png" alt=""><img src="./images/m1n7u98h0aet.webp" alt=""><img src="./images/m1n7u98h0aet.webp" alt=""><img src="./images/m1n7u98h0aet.webp" alt=""></div></div></div></div><!-- 技术优势 --><div class="bg tech"><h1>我们的技术优势</h1><div><img src="./images/7d5219a0ba20153ccea8b3dfd995db5.png" width="1268px" height="375px"></div></div><!-- 运营服务 --><div class="bg service"><h1>我们的运营服务</h1><div class="nierong"><div><img src="./images/大客服务.png" width="405px" height="215px"><div class="title">社群服务</div><div class="desc">标杆商家分享,同行商家交流,总比别人快一步</div></div><div><img src="./images/大客服务.png" width="405px" height="215px"><div class="title">管家服务</div><div class="desc">客户经理、服务管家、多角色在群,服务全面包围</div></div><div><img src="./images/大客服务.png" width="405px" height="215px"><div class="title">大客服务</div><div class="desc">设置夜班服务管家/假期值班管家,24小时在线服务,服务从不掉线</div></div><div><img src="./images/大客服务.png" width="405px" height="215px"><div class="title">运维服务</div><div class="desc">需求24小时反馈,需求处理率大于90% ,产品经理1v1回复</div></div></div></div><!-- 小鹅通 --><div class="bg xiaoet"><h1>他们都在用小鹅通</h1><div>(*排名不分先后顺序)</div></div><!-- 咨询 --><div class="bg advisory"><h1>立即扫码咨询,领取您的专属解决方案</h1></div><!-- 友情链接、公司信息 --><div class="bg message"><ul class="listo"><li>场景</li><li>行业</li><li>产品</li><li>服务</li><li>关于我们</li><li>媒体报道</li></ul></div>
</body></html>

css代码

.bg{width:100%;
}.header{background-image: url(../images/m28mek5n0yyx.webp);background-size:cover;background-position:center;
}.nav{height: 72px;/* background-color:aqua; */background-color:transparent;display:flex;justify-content: center;
}
.nav:hover{background-color:white;/* css3样式:过渡动画,让样式过渡持续指定时间 */transition: .2s all;
}.nav .content{width:1600px;/* background-color:antiquewhite; */display: flex;justify-content: space-between;
}
.logo{height:72px;width:120px;background-image:url(../images/logo.png);/* 设置背景图片,值-`url(图片相对路径) */background-size: 115px 35px;/*设置背景图片尺寸,宽度、高度*/background-repeat: no-repeat;/*  设置背景图片排列方式,默认x轴、y轴无限循环 */background-position: 0 20px;/*  设置背景图片出现的位置 */
}
.nav-menus{width:900px;display:flex;justify-content: space-between;
}
.nav-menus ul{list-style:none;display:flex;
}
.nav-menus li{line-height: 72px;padding: 0 15px;
}
.nav-menus li a{color:#333;text-decoration: none;cursor:pointer;
}
.nav-menus li a:hover{color:blue;
}.nav-login{display:flex;align-items: center;gap:20px;
}
.nav-login div:nth-of-type(2),
.nav-login div:nth-of-type(3),
.info .msg .btns div:nth-of-type(1),
.info .msg .btns div:nth-of-type(2){cursor:pointer;width:100px;height:40px;line-height: 40px;text-align:center;border:solid 1px #4872f6;border-radius:5px;background-color:white;color:#4872f6;
}
.info .msg .btns div:nth-of-type(1),
.info .msg .btns div:nth-of-type(2):hover,
.nav-login div:nth-of-type(3),
.nav-login div:nth-of-type(2):hover{color:white;background-color:#4872f6;translate: .5 all;
}
.info .msg .btns div:nth-of-type(1):hover,
.nav-login div:nth-of-type(3):hover{background-color:#819cf8;
}.banner{height:454px;/* background-color:bisque; */
}
.intro{padding: 90px;height:995px;background-color:#f5faff;display:flex;flex-direction: column;align-items: center;justify-content: space-between;
}
.intro h1,
.sence h1,
.xiaoet h1,
.service h1{font-size:42px;
}
.intro img{width:1263px;height:490px;
}
.intro .info{width:1263px;display:flex;flex-direction: row;justify-content: space-between;
}
.info > div{width: 407px;height: 194px;background-color:white;border-radius:12px;padding:28px;display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/justify-content: space-between;/* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.info .title{color:#333;font-size:26px;font-weight: 400;
}
.intro .info div:nth-of-type(1){border-top: solid 5px #4872f6;
}
.info .active{color:#4872f6;
}
.info p{color:gray;
}
.info a{color:#4872f6;text-decoration: none;
}.sence{padding: 90px;height:885px;background: linear-gradient(0deg, #ffffff, #edf1f9);display:flex;flex-direction: column;align-items: center;justify-content: space-between;
}
.sence .list{list-style:none;background-color:white;width:725px;height:42px;border-radius:21px;display:flex;justify-content: space-evenly;
}
.list li{height:42px;width:145px;border-radius:21px;text-align:center;line-height: 42px;font-size:14px;font-weight:400;
}
.list li:nth-of-type(1){background-color:#4872f6;color:white;
}
.sence .info{background-color:#f5f8fc;width:1263px;height:527px;display: flex;flex-direction: row;border-radius:12px;overflow:hidden;border:solid 5px white;
}
.sence .info img{width:650px;height:527px;
}
.sence .info .msg{width:100%;height:100%;padding: 50px;
}
.sence .msg h2{font-size:32px;
}
.sence .msg h3{font-size:26px;font-family: "黑体";font-weight:400;
}
.sence .msg ul{list-style:none;/* list-style-image: url(../images/ul.png); *//* list-style-position: inside; */color:gray;height:200px;/* background-color:#819cf8; */display:flex;flex-direction: column;justify-content: space-between;
}
.sence .msg ul li{background-image:url("../images/ul.png");background-repeat: no-repeat;background-position: 0 10px;padding-left:25px;
}
.msg .btns{display:flex;gap: 20px;
}.industry{color: #fff;height:732px;background-image: url("../images/行业背景图.png");/* 设置背景图片,值-`url(图片相对路径) */background-size: cover;/*设置背景图片尺寸,宽度、高度*//* background-repeat: no-repeat;设置背景图片排列方式,默认x轴、y轴无限循环 */background-position:center;/*  设置背景图片出现的位置 */display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/justify-content: space-evenly;/* align-items: center;`交叉轴方向的对齐方式(start\|center\|end) */align-items: center;/* justify-content: space-between; 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.industry h1{color:white;
}
/*
.标签的class属性值 {样式代码
}class选择器
父选择器  子选择器 {样式代码
}进阶 - 后代选择器
*/
.industry .he{width: 1268px;height: 459px;background: #39414C4D;border-radius:12px;overflow:hidden;backdrop-filter: blue(5px);display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 *//* flex-direction: row; *//* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*//* align-items: center; *//* `交叉轴方向的对齐方式(start\|center\|end) *//* justify-content: space-between;  *//* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.zuo{width: 181px;height: 457px;background-color: #2e3646;padding:28px 21px;display:flex;flex-direction: column;gap:20px;
}
.zuo div:nth-of-type(1),
.zuo div:nth-of-type(2),
.zuo div:nth-of-type(3),
.zuo div:nth-of-type(4){width:146px;height: 56px;display: flex;justify-content: center;align-items: center;cursor: pointer;/* 光标:指针 */
}
.zuo > div:nth-of-type(3){background: linear-gradient(90deg, #3e59af, #2e3646);
}
.zhuong{padding: 35px;color:white;display:flex;flex-direction: column;justify-content: space-between;font-size:13px;
}
.zhuong h2{font-size:26px;
}
.zhuong .msg{width:600px;display:flex;gap:20px;flex-wrap: wrap;
}
.msg div:nth-of-type(1),
.msg div:nth-of-type(2),
.msg div:nth-of-type(3),
.msg div:nth-of-type(4),
.msg div:nth-of-type(5),
.msg div:nth-of-type(6),
.msg div:nth-of-type(7),
.msg div:nth-of-type(8)
{width:75px;height: 75px;border:solid 1px #666;border-radius:4px;display:flex;flex-direction: column;align-items: center;justify-content: space-evenly;
}
.msg div:nth-of-type(1) img{width:30px;height:30px;
}
.zhuong .btns{display:flex;gap: 20px;margin-top:10px;
}
.btns div:nth-of-type(1),
.btns div:nth-of-type(2){transition: .2s all;/* 过渡:2s全部; */cursor:pointer;/* 游标:指针; */width:100px;height:40px;line-height: 40px;text-align:center;/* 文本对齐:居中; */border:solid 1px #4872f6;/* 边框:实心 */border-radius:5px;/* 边框半径:5px; */background-color:white;color:#4872f6;}
.btns div:nth-of-type(1),
.btns div:nth-of-type(2):hover
{color:white;background-color:#4872f6;
}
.you{width:200px;height:100%;padding:50px;
}
.you h4{padding-left:10px;padding-bottom:50px;font-size:18px;font-weight:500;color:white;
}
.you div{display:flex;flex-wrap: wrap;gap:20px;width:200px;
}
.you div img{width:83px;height: 83px;
}.tech{padding: 90px;height: 658px;background-color:rgb(248, 248, 248);display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.service{height: 734px;padding: 90px;background-color:rgb(248, 248, 248);display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.service .nierong{width: 1700px;height: 334px;display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: row;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.nierong .title{font-size: 21px;color: #333333;
}
.nierong .desc{font-size: 15px;color: #666666;
}
.xiaoet{height:1058px; background-color:rgb(206, 229, 243);padding: 90px;display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.xiaoet .div{width: 150px;height: 20px;color: #666666}
.advisory{color: #fff;height:264px;background-color:rgb(5, 54, 249);display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.message{height:721px;background-color:rgb(36, 36, 36);color: #fff;display:flex;/* 将当前的标签(容器)设置为弹性模型 弹性样式:默认从左到右进行排列 */flex-direction: column;/* 样式修改主轴方向 *//* 弹性样式的主轴方向,默认水平方向(行)row: 水平-从左到右依次排列row-reverse:水平-从右到左依次排列column:垂直-从上到下依次排列column-reverse:垂直-从下到上一次排列*/align-items: center;/* `交叉轴方向的对齐方式(start\|center\|end) */justify-content: space-between; /* 主轴方向对齐方式    space-between 从左到右平均分布,两侧不留空隙 */
}
.listo{list-style:none;background-color:white;width:725px;height:42px;border-radius:21px;display:flex;justify-content: space-evenly;
}

最终效果

相关文章:

模拟开发小鹅通首页网站练习

HTML代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>小鹅通-首页</title><!-- 引入页…...

Ubuntu 下 nginx-1.24.0 源码分析 - ngx_strerror 函数

声明 ngx_strerror 函数声明在 ngx_errno.h 中&#xff1a; u_char *ngx_strerror(ngx_err_t err, u_char *errstr, size_t size); 实现 在 ngx_errno.c 中&#xff1a; u_char * ngx_strerror(ngx_err_t err, u_char *errstr, size_t size) {size_t len;const char *ms…...

第26场蓝桥入门赛

5.扑克较量【算法赛】 - 蓝桥云课 C&#xff1a; #include <iostream> #include <algorithm> using namespace std;int a[100005];int main() {int n,k;cin>>n>>k;for (int i1; i<n; i)cin>>a[i], a[i] % k;sort(a1, a1n);int mx a[1]k-a…...

【CAPL实战】实现弹窗提示及操作

文章目录 前言1、TestWaitForTesterConfirmation函数2、测试举例 前言 在使用CANoe进行车载通信测试的过程中&#xff0c;可能因为一些条件限制&#xff0c;我们需要在测试执行的过程中去观察一些硬件显示或者调整相关硬件状态。比如测试过程中&#xff0c;需要手动去调整小电…...

基于ESP32的远程开关灯控制(ESP32+舵机+Android+物联网云平台)

目录 材料环境准备物理材料软件环境 物联网平台配置&#xff08;MQTT&#xff09;MQTT阿里云平台配置创建产品添加设备自定义topic esp32配置接线代码 Android部分和云平台数据流转 前言&#xff1a;出租屋、宿舍网上关灯问题&#xff0c;计划弄一个智能开关以及带一点安防能力…...

协议-ACLLite-ffmpeg

是什么&#xff1f; FFmpeg是一个开源的多媒体处理工具包&#xff0c;它集成了多种功能&#xff0c;包括音视频的录制、转换和流式传输处理。FFmpeg由一系列的库和工具组成&#xff0c;其中最核心的是libavcodec和libavformat库。 libavcodec是一个领先的音频/视频编解码器库&…...

ARM嵌入式学习--第十四天(SPI)

SPI -介绍 SPI&#xff08;Serial Peripheral Interface&#xff09;串行外围设备接口。是由Motorola公司开发&#xff0c;用来在微控制器和外围设备芯片之间提供一个低成本&#xff0c;易使用的接口。这样接口可以用来连接存储器、AD转换器、DA转换器、实时时钟、LCD驱动器、…...

DeepSeek-V2 论文解读:混合专家架构的新突破

论文链接&#xff1a;DeepSeek-V2: A Strong, Economical, and Efficient Mixture-of-Experts Language Model 目录 一、引言二、模型架构&#xff08;一&#xff09;多头部潜在注意力&#xff08;MLA&#xff09;&#xff1a;重塑推理效率&#xff08;二&#xff09;DeepSeekM…...

5分钟了解回归测试

1. 什么是回归测试&#xff08;Regression Testing&#xff09; 回归测试是一个系统的质量控制过程&#xff0c;用于验证最近对软件的更改或更新是否无意中引入了新错误或对以前的功能方面产生了负面影响&#xff08;比如你在家中安装了新的空调系统&#xff0c;发现虽然新的空…...

路由器如何进行数据包转发?

路由器进行数据包转发的过程是网络通信的核心之一&#xff0c;主要涉及以下几个步骤&#xff1a; 接收数据包&#xff1a;当一个数据包到达路由器的一个接口时&#xff0c;它首先被暂时存储在该接口的缓冲区中。 解析目标地址&#xff1a;路由器会检查数据包中的目标IP地址。…...

【HarmonyOS之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(四) -> 常见组件(一)

目录 1 -> List 1.1 -> 创建List组件 1.2 -> 添加滚动条 1.3 -> 添加侧边索引栏 1.4 -> 实现列表折叠和展开 1.5 -> 场景示例 2 -> dialog 2.1 -> 创建Dialog组件 2.2 -> 设置弹窗响应 2.3 -> 场景示例 3 -> form 3.1 -> 创建…...

iOS 自动翻滚广告条(榜单条)实现方案

引言 在直播场景中&#xff0c;榜单信息、活动公告或者广告推广通常需要以醒目的方式展示&#xff0c;但由于屏幕空间有限&#xff0c;一次只能显示一条内容。为了让用户能够持续关注这些信息&#xff0c;我们可以实现一个自动翻滚的广告条&#xff08;或榜单条&#xff09;&a…...

TensorFlow深度学习实战(7)——分类任务详解

TensorFlow深度学习实战&#xff08;7&#xff09;——分类任务详解 0. 前言1. 分类任务1.1 分类任务简介1.2 分类与回归的区别 2. 逻辑回归3. 使用 TensorFlow 实现逻辑回归小结系列链接 0. 前言 分类任务 (Classification Task) 是机器学习中的一种监督学习问题&#xff0c;…...

动态规划问题——青蛙跳台阶案例分析

问题描述&#xff1a; 一只青蛙要跳上n级台阶&#xff0c;它每次可以跳 1级或者2级。问&#xff1a;青蛙有多少种不同的跳法可以跳完这些台阶&#xff1f; 举个例子&#xff1a; 假设台阶数 n 3 &#xff0c;我们来看看青蛙有多少种跳法。 可能的跳法&#xff1a; 1. 跳1级…...

element-ui使用el-table,保留字段前的空白

项目名称项目编号1、XXXXX1111111111111111111 1.1 XXXXX11111111111111222222222 如上表格中&#xff0c;实现项目名称字段1.1前空白的效果。 从JAVA返回的数据带有空白&#xff0c;即数据库中插入的数据带有空白。 原先写法&#xff1a; <el-table><el-tabl…...

kamailio中路由模块汇总

功能模块描述请求路由 (request_route)主要处理进入的SIP请求&#xff0c;包含初步检查、NAT检测、CANCEL请求处理、重传处理等。处理通过REQINIT、NATDETECT、RELAY等子模块的调用。CANCEL处理对CANCEL请求进行处理&#xff0c;包括更新对话状态并检查事务。如果事务检查通过&…...

如何使用 DeepSeek 搭建本地知识库

使用 DeepSeek 搭建本地知识库可以帮助您高效管理和检索本地文档、数据或知识资源。以下是详细的步骤指南&#xff1a; 1. 准备工作 (1) 安装 DeepSeek 确保您的系统已安装 Python 3.8 或更高版本。使用 pip 安装 DeepSeek&#xff1a; bash pip install deepseek (2) 准备…...

网络HTTP详细讲解

学习目标 什么是HTTPHTTP的请求和响应常见的HTTP状态码HTTP的安全性 什么是HTTP&#xff1f;HTTP的请求和响应&#xff0c;常见的HTTP状态码&#xff0c;HTTP的安全性 什么是HTTP HTTP&#xff08;HyperText Transfer Protocol&#xff0c;超文本传输协议&#xff09;是一种用…...

《Origin画百图》之边际分布曲线图

《Origin画百图》第六集——边际分布曲线图 入门操作可看《30秒&#xff0c;带你入门Origin》 边际分布曲线图&#xff0c;其中包含散点图形&#xff0c;而在图的边际有着分布曲线图。在比较数据以查看多个变量之间是否存在关系时非常有用。 1.数据准备&#xff1a;为多列XY数…...

【Milvus】向量数据库pymilvus使用教程

以下是根据 Milvus 官方文档整理的详细 PyMilvus 使用教程&#xff0c;基于 Milvus 2.5.x 版本&#xff1a; PyMilvus 使用教程 目录 安装与环境准备连接 Milvus 服务数据模型基础概念创建集合&#xff08;Collection&#xff09;插入数据创建索引向量搜索删除操作完整示例注…...

React 生命周期函数详解

React 组件在其生命周期中有多个阶段&#xff0c;每个阶段都有特定的生命周期函数&#xff08;Lifecycle Methods&#xff09;。这些函数允许你在组件的不同阶段执行特定的操作。以下是 React 组件生命周期的主要阶段及其对应的生命周期函数&#xff0c;并结合了 React 16.3 的…...

第 26 场 蓝桥入门赛

2.对联【算法赛】 - 蓝桥云课 问题描述 大年三十&#xff0c;小蓝和爷爷一起贴对联。爷爷拿出了两副对联&#xff0c;每副对联都由 N 个“福”字组成&#xff0c;每个“福”字要么是正的&#xff08;用 1 表示&#xff09;&#xff0c;要么是倒的&#xff08;用 0 表示&#…...

组合(力扣77)

从这道题开始&#xff0c;我们正式进入回溯算法的学习。之前在二叉树中只是接触到了一丢丢&#xff0c;而这里我们将使用回溯算法解决很多经典问题。 那么这道题是如何使用回溯算法的呢&#xff1f;在讲回溯之前&#xff0c;先说明一下此题是如何递归的。毕竟回溯递归不分家&a…...

网络工程师 (22)网络协议

前言 网络协议是计算机网络中进行数据交换而建立的规则、标准或约定的集合&#xff0c;它规定了通信时信息必须采用的格式和这些格式的意义。 一、基本要素 语法&#xff1a;规定信息格式&#xff0c;包括数据及控制信息的格式、编码及信号电平等。这是协议的基础&#xff0c;确…...

Linux之文件IO前世今生

在 Linux之文件系统前世今生&#xff08;一&#xff09; VFS中&#xff0c;我们提到了文件的读写&#xff0c;并给出了简要的读写示意图&#xff0c;本文将分析文件I/O的细节。 一、Buffered I/O&#xff08;缓存I/O&#xff09;& Directed I/O&#xff08;直接I/O&#…...

如何在Windows中配置MySQL?

MySQL是一个广泛使用的开源关系型数据库管理系统&#xff0c;它支持多种操作系统平台&#xff0c;其中包括Windows。无论是开发者进行本地开发&#xff0c;还是管理员为应用程序配置数据库&#xff0c;MySQL都是一个非常流行的选择。本篇文章将详细介绍如何在Windows操作系统中…...

Kafka 入门与实战

一、Kafka 基础 1.1 创建topic kafka-topics.bat --bootstrap-server localhost:9092 --topic test --create 1.2 查看消费者偏移量位置 kafka-consumer-groups.bat --bootstrap-server localhost:9092 --describe --group test 1.3 消息的生产与发送 #生产者 kafka-cons…...

数学知识学习1

1、数论 1质数判定 i<n/i优化O(sqrt(n)) bool is_prime(int n){if(n<2)return false;for(int i2;i<n/i;i){if(n%i0)return false;} true; } 分解质因数 i<n/i优化O(sqrt(n)) // 定义一个函数 divide&#xff0c;接收一个整数 n 作为参数&#xff0c;用于分解质…...

【AI日记】25.02.08

【AI论文解读】【AI知识点】【AI小项目】【AI战略思考】【AI日记】【读书与思考】【AI应用】 探索 AI 应用探索周二有个面试&#xff0c;明后天打算好好准备一下&#xff0c;我打算主要研究下 AI 如何在该行业赋能和应用&#xff0c;以及该行业未来的发展前景和公司痛点&#…...

Lecture8 | LPV VXGI SSAO SSDO

Review: Lecture 7 | Lecture 8 LPV (Light Propagation Volumes) Light Propagation Volumes(LPV)-孤岛惊魂CryEngine引进的技术 LPV做GI快|好 大体步骤&#xff1a; Step1.Generation of Radiance Point Set Scene Representation 生成辐射点集的场景表示&#xff1a;辐射…...