CSS 入门指南（二）CSS 常用样式及注册页面案例

CSS 常用样式

颜色属性

常见样式的颜色属性：

  • color：定义文本的颜色
  • border-color：定义边框的颜色
  • background-color：设置背景色

颜色属性值设置方式：

  • 十六进制值 - 如：＃FF0000
  • 一个RGB值 - 如：RGB(255,0,0)
  • 颜色的名称 - 如：red

参阅 CSS 颜色值 查看完整的颜色值


边框和尺寸

  • 边框：定义元素的边框

    常用属性：

    • border-style：定义边框的样式

      属性值：

      • none：默认，无边框
      • dotted：定义一个点线边框
      • dashed：定义一个虚线边框
      • solid：定义实线边框
      • double：定义两个边框。 两个边框的宽度和 border-width 的值相同
      • groove：定义3D沟槽边框。效果取决于边框的颜色值
      • ridge：定义3D脊（山脊）边框。效果取决于边框的颜色值
      • inset:定义一个3D的嵌入边框。效果取决于边框的颜色值
      • outset：定义一个3D突出边框。 效果取决于边框的颜色值

      border-style 属性可以有 1-4 个值：

      • 4 个值：上 下 左 右

        示例：border-style:dotted solid double dashed;

        上边框是 dotted，右边框是 solid，底边框是 double，左边框是 dashed

      • 3 个值： 上 左右 下

        示例：border-style:dotted solid double;

        上边框是 dotted，左、右边框是 solid，底边框是 double

      • 2 个值：上下 左右

        示例：border-style:dotted solid;

        上、底边框是 dotted，右、左边框是 solid

      • 1 个值：上下左右

        示例：border-style:dotted;

        四面边框是 dotted

    • border-color：定义边框的颜色。属性值详见颜色属性

      注意： border-color 单独使用是不起作用的，必须得先使用 border-style 来设置边框样式

    • border-width：定义边框的宽度

      为边框指定宽度的方式：

      • 方法1：可以指定长度值，比如 2px 或 0.1em（单位为 px，pt，cm，em 等）
      • 方法2：使用 3 个关键字之一，分别是 thick 、medium（默认值） 和 thin

      **注意：**CSS 没有定义 3 个关键字的具体宽度，所以一个用户可能把 thick 、medium 和 thin 分别设置为等于 5px、3px 和 2px，而另一个用户则分别设置为 3px、2px 和 1px。

    • border：同时设置元素的 4 个边框（上下左右）的颜色，尺寸（像素），格式。不区分先后顺序

      单独设置各边

      • border-top：设置上边框
      • border-right：设置右边框
      • border-bottom：设置下边框
      • border-left：设置左边框

    • border-radius：设置四个角（左上，右上，右下，左下）边框从多少像素开始圆滑

    • border-collapse：设置表格的边框是否被折叠成一个单一的边框或隔开。一般设置一个值全部应用

  • 尺寸：设置元素的高度和宽度

    • width：设置元素的宽度，单位可以是像素（px）、百分比（%）或其他可用单位

      • 像素（px）：固定值

        注：

        • 屏幕（显示器）实际上是由一个一个的小点点构成的
        • 不同屏幕的像素大小是不同的，像素越小的屏幕显示的效果越清晰
        • 所以同样的 200px 在不同的设备下显示效果不一样

      • 百分比（%）：相对于父元素的大小。这种方式可以实现响应式布局。

      • 自适应长度：使用 auto 属性值来让元素自适应父元素的大小

        比如将图片的 width 属性设置为 80%，然后 height 属性将其高度设置为 auto，让其自适应父元素的大小，这样可以保持图片的宽高比例，并且不会出现变形。

      • em：相对于元素的字体大小来计算

        1em = 1font-size

        em 会根据字体大小的改变而改变

      • rem：相对于根元素 <html> 的字体大小来计算

    • height：设置元素的高度，单位可以是像素（px）、百分比（%）或其他可用单位

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>边框和尺寸</title><style>div{/*给div添加边框*/border: 1px red solid;border-bottom: 10px green double;border-left: 5px ridge;/*给div设置尺寸*/width: 300px;height: 100px;}span{/*给span标签添加边框*/border: red solid 2px;/*给span添加边框圆角*/border-radius: 50px;}</style>
</head>
<body><div>我是一个div</div><span>我是一个span</span>
</body>
</html>

行内|行间 转换属性

display：可以把行间元素和行内元素相互转换，还可以隐藏元素

  • 行间元素：占用 html 中的一行

    例如：h1-h6，ul，ol，div …

  • 行内元素：占用一行中的一部分

    例如：span，img，a …

display 的属性值：

  • inline：设置元素为行内元素（行内元素默认 display 的属性值）
  • block：设置元素为行间元素（行间元素默认 display 的属性值）
  • none：设置隐藏元素（不在 html 页面中显示，也不会占用空间）
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>转换属性</title><style>div{border: 1px solid red;}span{border: 1px solid green;}</style>
</head>
<body><div>我是一个div,我会占用一行</div><!--使用display属性inline把div转换为行内元素--><div style="display: inline">我是一个div,我只占用一行的一部分</div><span>我是一个span,我只占用一行的一部分</span><!--使用display属性block把span转换为行间元素--><span style="display: block">我是一个span,我会占用一行</span><!--使用display属性none隐藏标签--><span style="display: none">我是隐藏起来的标签,你看不到我</span><img style="display: none" src="img/2.jpg" height="100px" width="80px">
</body>
</html>

文本格式

  • color：设置字体颜色。属性值详见颜色属性

  • text-align：文本的对齐方式

    属性值：

    • center：居中
    • left：对齐到左
    • right：对齐到右
    • justify：两端对齐

  • text-indent：指定文本的第一行的缩进，单位为像素 px

  • text-align：对齐元素中的文本

  • text-shadow：设置文本阴影

  • text-decoreation：设置或删除文本的装饰。主要是用来删除链接的下划线

    • none：取消文字的下划线

  • text-transform：文本转换。指定在一个文本中的字母变成大写或小写字母，或每个单词的首字母大写

    • uppercase：大写字母
    • owercase：小写字母
    • capitalize：单词首字母大写

  • line-height：设置行高

  • letter-spacing：设置字符间距

  • word-spacing：设置字间距

  • vertical-align：设置元素的垂直对齐

  • white-space：设置元素中空白的处理方式

  • unicode-bidi：设置或返回文本是否被重写

  • direction：设置文本方向

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>字体属性</title>
</head>
<body><a href="http://www.itheima.com" target="_blank" style="color: red">我是红色的超链接</a><br/><a href="http://www.itheima.com" target="_blank" style="text-decoration: none">我是没有下划线的超链接</a>
</body>
</html>

字体样式

  • font-family：设置文本的字体系列（幼圆，宋体，楷体）

    注意：

    • font-family 属性应该设置几个字体名称作为一种"后备"机制，如果浏览器不支持第一种字体，则将尝试下一种字体

      多个字体系列是用一个逗号分隔指明

    • 如果字体系列的名称超过一个字，它必须用引号，如 Font Family：“宋体”

  • font-size：设置字体大小

    能否管理文字的大小，在网页设计中是非常重要的。但是，不能通过调整字体大小使段落看上去像标题，或者使标题看上去像段落。务必使用正确的 HTML 标签，就 <h1> - <h6> 表示标题和 <p>表示段落

    如果不指定一个字体的大小，默认大小和普通文本段落一样，是 16 像素（16px=1em）

    字体大小的值可以设置为绝对或相对的大小：

    • 绝对大小：

      • 设置一个指定大小的文本，单位为像素 px
      • 不允许用户在所有浏览器中改变文本大小
      • 确定了输出的物理尺寸时绝对大小很有用

    • 相对大小：

      • 相对于周围的元素来设置大小，单位为 em

        1em的默认大小是16px

      • 允许用户在浏览器中改变文字大小

      使用百分比和 em 组合可以在所有浏览器中显示相同的文本大小，并允许所有浏览器缩放文本的大小：

      • 设置 <body>元素的默认字体大小的是百分比

      • 示例：

        body {font-size:100%;}
h1 {font-size:2.5em;}
h2 {font-size:1.875em;}
p {font-size:0.875em;}

  • font-weight：设置字体加粗，取值：bold

  • font-style：指定斜体文字的字体样式属性

    • normal：正常显示文本

    • italic：使用默认的斜体设置

      注：并不是所有字体都有默认的斜体设置，一些不常用的字体，或许就只有个正常体，如果用 italic，则没有效果

    • oblique：强制使用斜体，让没有默认斜体属性的文字倾斜，且可以指定斜体的角度

      <div style="font-style: oblique 5deg;">This is a sentence.</div>
<div style="font-style: oblique 10deg;">This is a sentence.</div>

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>字体属性</title>
</head>
<body><a href="http://www.itheima.com" target="_blank" style="font-size: 50px">我是50px大小的超链接</a><br/><a href="http://www.itheima.com" target="_blank" style="font-weight: bold">我是粗体的超链接</a><br/><a href="http://www.itheima.com" target="_blank" style="font-style: italic">我是斜体的超链接</a><br/><a href="http://www.itheima.com" target="_blank" style="font-style: italic;font-weight: bold;color: green">我是粗体斜体绿色的超链接</a><br/><a href="http://www.itheima.com" target="_blank" style="font-family: 楷体">我是楷体的超链接</a><br/>
</body>
</html>

背景色和背景图片

  • background-color：设置背景色。属性值详见颜色属性
  • background-image：url（图片的地址）设置背景图片
  • background-repeat：no-repeat（背景图片不平铺）
  • background-position：top 0px right 0px（背景图片位置 右上角）

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>背景色和背景图片</title>
</head>
<!--给整个body添加一个背景图片-->
<body style="background-image: url(img/bg.jpg);background-repeat:no-repeat;background-position: top 30px right 100px"><!--给div添加一个背景色--><div style="border: 1px red solid;background-color: pink;width: 300px; height: 500px">我是一个div</div><!--给提交按钮添加背景色--><input type="submit" value="用户注册" style="background-color: gold;color: white">
</body>
</html>

链接样式

在支持 CSS 的浏览器中，链接的不同状态都可以不同的方式显示。链接的样式，可以用任何 CSS 属性（如颜色，字体，背景等）。

四个链接状态：

  • a:link：正常，未访问过的链接
  • a:visited：用户已访问过的链接
  • a:hover：当用户鼠标放在链接上时
  • a:active：链接被点击的那一刻

注意：当设置为若干链路状态的样式时，也有一些顺序规则：

  • a:hover 必须跟在 a:link 和 a:visited后面
  • a:active 必须跟在 a:hover后面

案例：

<style>a:link {color: #FF0000}		/* 未访问的链接 */a:visited {color: #00FF00}	/* 已访问的链接 */a:hover {color: #FF00FF}	/* 鼠标移动到链接上 */a:active {color: #0000FF}	/* 选定的链接 */
</style>
<a href="http:\\www.itcast.cn" target="_blank">点击我到传智</a>

filters：滤镜

  • filters 是 CSS3 里新增的一种功能，可以为元素指定各种滤镜效果，例如模糊效果、透明效果、色彩反差调整等等；同时，CSS 滤镜不仅可以对图片进行滤镜处理，还可以对网页元素甚至视频进行滤镜处理。

  • filter 的基础使用非常简单，CSS 标准里包含了一些已实现预定义效果的函数，可以通过指定这些函数的值来实现想要的效果

  • 常用filter函数：

    滤镜效果函数补充
    无none默认值，表示没有效果
    模糊blur(px)为图像设置高斯模糊，默认值为 0，单位为像素，值较大越模糊
    调整亮度brightness(number)number 越大图像越亮，number 不能取负值，可以是整数也可以是百分比
    调整灰度grayscale(%)将图像转换为灰度图像，默认值为 0%，表示原始图像；
    100％ 表示将图像完全变成灰度图像（即黑白图像），不允许为负值
    调整对比度contrast(%)默认值为 100％，代表原始图像；0％ 将使图像完全变黑；
    当值超过 100％ 时图像将获得更高的对比度
    阴影drop-shadow(h-shadow v-shadow blur spread color)为图像添加阴影效果，参数说明如下：
    h-shadow：必填值，指定水平方向阴影的像素值，若值为负，则阴影会出现在图像的左侧；
    v-shadow：必填值，指定垂直方向阴影的像素值，若值为负，则阴影会出现在图像的上方；
    blur：可选值，为阴影添加模糊效果，默认值为 0，单位为像素，值越大创建的模糊就越多（阴影会变得更大更亮），不允许使用负值；
    spread：可选值，默认值为 0，单位为像素。若值为正，则阴影将会扩展并增大；若值为负，则阴影会缩小；
    color：可选值，为阴影添加颜色，如未指定，则由浏览器来绝对，通常为黑色。
    注意：Chrome、Safari 和 Opera 等浏览器不支持第 4 个参数，如果添加，则不会有任何效果
    反转图像invert(%)默认值为 0%，表示原始图像；100% 则表示完全反转，不允许使用负值
    不透明度opacity(%)默认值为 100%，表示原始图像；0% 表示完全透明，不允许使用负值
    图像转为棕褐色sepia(%)默认值为 0%，表示原始图像；100% 表示图像完全变成棕褐色，不允许使用负值
    调整饱和度saturate(%)默认值为 100%，表示原始图像；0% 表示图像完全不饱和，不允许使用负值
    图像色相旋转hue-rotate(deg)该值用来定义色环的度数，默认值为 0 deg，代表原始图像，最大值为 360deg

CSS 的盒子模型

CSS 的盒子模型：可以把 html 中的任意元素，都可以看成是被一个盒子包裹起来

  • 盒子的外边距：设置这个盒子到其他盒子之间的距离，或者设置盒子到 body 框的距离

    使用 css 的属性（margin）设置外边距：

    • margin：同时设置4个外边距
    • margin-top：设置上外边距
    • margin-right：设置右外边距
    • margin-bottom：设置下外边距
    • margin-left：设置左外边距

  • 盒子的内边距：设置盒子边框到盒子中内容的距离

    使用 css 的属性（padding）设置内边距（填充）：

    • padding：同时设置4个内边距
    • padding-top：设置上内边距
    • padding-right：设置右内边距
    • padding-bottom：设置下内边距
    • padding-left：设置左内边距

  • 总元素的宽度 = 宽度 + 左填充 + 右填充 + 左边框 + 右边框 + 左边距 + 右边距

    总元素的高度 = 高度 + 顶部填充 + 底部填充 + 上边框 + 下边框 + 上边距 + 下边距

在这里插入图片描述

案例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>CSS的盒子模型</title><style>div{/*设置div的边框和尺寸*/border: 1px solid red;width: 300px;height: 200px;/*设置div的外边距*/margin: 50px;	/*同时设置4个外边距为50px*/margin-left: 100px;		/*设置左外边距100px*/margin: 50px 100px;		/*上下50px 左右100px*/margin: 50px 100px 150px;	/*顺时针上50px 右100px 下150px 左100px*/margin: 50px 100px 150px 200px;	/*顺时针上50px 右100px 下150px 左200px*/margin: 50px auto;	/*上下50px 左右auto会自动居中*//*设置div的内边距*/padding: 50px;	/*同时设置4个内边距为50px*/}</style>
</head>
<body><div>我是一个div</div>
</body>
</html>

注册页面案例

页面原型

在这里插入图片描述


需求分析

在这里插入图片描述


案例实现

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>注册页面案例</title><style>/*设置外部div的样式*/.bigDiv{height: 500px;/*高度*/width: 800px;/*宽度*/border: 10px gray ridge;/*边框*/margin: 50px auto;/*外边距*/background-color: white;/*背景色*/}/*设置内部div的样式*/.regDiv{height: 500px;/*高度*/width: 400px;/*宽度*/margin: 0px auto;/*外边距*/font-family: "楷体";/*字体*/color: gray;/*字体颜色*//*border: 1px red solid;*/}/*设置所有tr的高度*/tr{height: 50px;}/*7.设置input标签的样式(高度,宽度,边框,边框圆角,颜色)*/input[type="text"],input[type="password"],input[type="date"],input[type="email"]{border: 1px solid gray;/*边框*/width: 180px;/*宽度*/height: 30px;/*高度*/border-radius: 15px;/*边框圆角*/}/*8.设置验证码input标签的宽度*/input[name="checkCode"]{width: 60px;}/*9.设置用户注册案例的样式(边框,背景色,字体颜色,居中,尺寸)*/input[type="submit"]{width: 100px;/*宽度*/height: 30px;/*高度*/background-color: gold;/*背景色*/color: white;/*字体颜色*/border: 1px solid gold;/*边框*/border-radius: 5px;/*边框圆角*/}</style>
</head>
<!--1.给整个body添加一个背景色(米黄色)-->
<body style="background-color: beige"><!--2.创建一个外层的div,设置样式(边框,背景色,尺寸,外边距)--><div class="bigDiv"><!--3.创建一个内层的div,设置样式(尺寸,外边距,字体,字体颜色)--><div class="regDiv"><!--4.创建一个form表单--><form action="#" method="get"><!--5.在form中创建9*2的表格--><table><!--6.给表格中添加元素(文本,input标签,图片)--><tr><td>用户名</td><td><input type="text" name="username" placeholder="请输入用户名"/></td></tr><tr><td>密码</td><td><input type="password" name="password" placeholder="请输入密码"/></td></tr><tr><td>邮箱</td><td><input type="email" placeholder="请输入邮箱"/></td></tr><tr><td>姓名</td><td><input type="text" name="name" placeholder="请输入姓名"/></td></tr><tr><td>手机号</td><td><input type="text" name="phone" placeholder="请输入手机号"/></td></tr><tr><td>性别</td><td><input type="radio" name="sex" checked="checked"/>男<input type="radio" name="sex" />女</td></tr><tr><td>生日</td><td><input type="date" name="birthday"/></td></tr><tr><td>验证码</td><td><input type="text" name="checkCode" placeholder="验证码"/><img src="img/checkCode.bmp"></td></tr><tr><td colspan="2" align="center"><input type="submit" value="用户注册"/></td></tr></table></form></div></div>
</body>
</html>

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

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

相关文章

使用 SPL 高效实现 Flink SLS Connector 下推

使用 SPL 高效实现 Flink SLS Connector 下推

作者&#xff1a;潘伟龙&#xff08;豁朗&#xff09; 背景 日志服务 SLS 是云原生观测与分析平台&#xff0c;为 Log、Metric、Trace 等数据提供大规模、低成本、实时的平台化服务&#xff0c;基于日志服务的便捷的数据接入能力&#xff0c;可以将系统日志、业务日志等接入 …
阅读更多...
打字通小游戏制作教程：用HTML5和JavaScript提升打字速度

打字通小游戏制作教程：用HTML5和JavaScript提升打字速度

&#x1f31f; 前言 欢迎来到我的技术小宇宙&#xff01;&#x1f30c; 这里不仅是我记录技术点滴的后花园&#xff0c;也是我分享学习心得和项目经验的乐园。&#x1f4da; 无论你是技术小白还是资深大牛&#xff0c;这里总有一些内容能触动你的好奇心。&#x1f50d; &#x…
阅读更多...
Redis主从架构和管道Lua(一)

Redis主从架构和管道Lua(一)

Redis主从架构 架构 Redis主从工作原理 如果为master配置了一个slave,不管这个slave是否是第一次连接上Master,它都会发送一个PSYNC命令给master请求复制数据。master受到PSYNC命令&#xff0c;会在后台进行数据持久化通过bgsave生成最新的 RDB快照文件&#xff0c;持久化期间…
阅读更多...
Java 集合类的高级特性介绍

Java 集合类的高级特性介绍

在 Java 编程中&#xff0c;了解集合类的高级特性对于编写高效和可维护的代码至关重要。以下是一些你应该知道的 Java 集合类的高级特性&#xff0c;以及简单的例子来说明它们的用法。 1. 迭代器&#xff08;Iterators&#xff09;和列表迭代器&#xff08;ListIterators&#…
阅读更多...
Babel：现代JavaScript的桥梁

Babel：现代JavaScript的桥梁

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…
阅读更多...
基于YOLOv8深度学习的路面坑洞检测与分割系统【python源码+Pyqt5界面+数据集+训练代码】深度学习实战、目标分割

基于YOLOv8深度学习的路面坑洞检测与分割系统【python源码+Pyqt5界面+数据集+训练代码】深度学习实战、目标分割

《博主简介》 小伙伴们好&#xff0c;我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源&#xff0c;可关注公-仲-hao:【阿旭算法与机器学习】&#xff0c;共同学习交流~ &#x1f44d;感谢小伙伴们点赞、关注&#xff01; 《------往期经典推…
阅读更多...
如何入驻1688跨境市场，拿新赛道下的百万流量！|1688API接口一键链接国内外

如何入驻1688跨境市场，拿新赛道下的百万流量！|1688API接口一键链接国内外

✦ ✦ ✦ 前言 1688是国内领先源头厂货直销平台&#xff0c;拥有2亿用户、6500万专业卖家&#xff0c;覆盖57大行业、年交易额︎8000亿&#xff0c;100万中小企业已入驻。刚刚升为阿里第一批战略级创新业务的1688&#xff0c;又被曝出新消息。近期&#xff0c;关于“阿里16…
阅读更多...
Socket通信Demo(Unity客户端和C#)

Socket通信Demo(Unity客户端和C#)

新建一个Unity项目新建脚本编写客户端 using System.Net.Sockets; using System.Net; using System; using System.Text;public class Client : MonoBehaviour {private Socket socket;//定义用来存消息的容器private byte[] buffer new byte[1024];// Start is called befor…
阅读更多...
使用GraaVIM打包Linux平台本地镜像

使用GraaVIM打包Linux平台本地镜像

1.创建实例&#xff0c;在WindTerm上面连接云服务器 2.安装Lrzsz文件上传工具 yum install lrzsz 3.上传打好的jar包 lrz 使用ls命令查看是否上传成功 3.安装gcc等环境 sudo yum install gcc glibc-devel zlib-devel 4.下载安装配置Linux下的GraaVIM、native-image 下载链…
阅读更多...
RocketMQ入门指南：从零开始学习分布式消息队列技术

RocketMQ入门指南：从零开始学习分布式消息队列技术

RocketMQ 1. MQ介绍1.1 为什么要用MQ1.2 MQ的优点和缺点1.3 各种MQ产品的比较 2. RocketMQ快速入门2.1 准备工作2.1.1 下载RocketMQ2.2.2 环境要求 2.2 安装RocketMQ2.2.1 安装步骤2.2.2 目录介绍 2.3 启动RocketMQ2.4 测试RocketMQ2.4.1 发送消息2.4.2 接收消息 2.5 关闭Rocke…
阅读更多...
模板不存在:./Application/Home/View/OnContact/Index.html 错误位置

模板不存在:./Application/Home/View/OnContact/Index.html 错误位置

模板不存在:./Application/Home/View/OnContact/Index.html 错误位置FILE: /home/huimingdedhpucixmaihndged5e/wwwroot/ThinkPHP123/Library/Think/View.class.php 　LINE: 110 TRACE#0 /home/huimingdedhpucixmaihndged5e/wwwroot/ThinkPHP123/Library/Think/View.class.php(…
阅读更多...
接收服务端请求，WebSocket 并非唯一选择！（含：ChatGPT 流推送原理解析）

接收服务端请求，WebSocket 并非唯一选择！（含：ChatGPT 流推送原理解析）

前端训练营&#xff1a;1v1私教&#xff0c;终身辅导计划&#xff0c;帮你拿到满意的 offer。 已帮助数百位同学拿到了中大厂 offer。欢迎来撩~~~~~~~~ Hello&#xff0c;大家好&#xff0c;我是 Sunday。 说到推送数据&#xff0c;大家可能首先想到的是 WebSocket。 事实上&…
阅读更多...
STM32利用标准库的方式输出PWM（proteus仿真）

STM32利用标准库的方式输出PWM（proteus仿真）

首先打开proteus仿真软件&#xff0c;绘制电路图&#xff1a; 其中示波器的添加很简单的&#xff0c;看图&#xff1a; 再来看看咱们最后程序的效果&#xff1a; 下面就是程序代码了&#xff0c;新建两个文件PWM.c和PWM.h文件&#xff0c;所属关系如图&#xff1a; 整个的编程思…
阅读更多...
VBA_NZ系列工具NZ02：VBA读取PDF使用说明

VBA_NZ系列工具NZ02：VBA读取PDF使用说明

我的教程一共九套及VBA汉英手册一部&#xff0c;分为初级、中级、高级三大部分。是对VBA的系统讲解&#xff0c;从简单的入门&#xff0c;到数据库&#xff0c;到字典&#xff0c;到高级的网抓及类的应用。大家在学习的过程中可能会存在困惑&#xff0c;这么多知识点该如何组织…
阅读更多...
亚马逊店铺解决和预防订单下滑的技巧

亚马逊店铺解决和预防订单下滑的技巧

1. 保持账号的良好表现。不要销售侵权产品&#xff0c;发货要及时&#xff0c;能有追踪号的就带可查询追踪号&#xff0c;能发FBA的就通过FBA发货。 2. 持续做好产品优化工作&#xff0c;及时留意大环境的变化和平台政策变动。遇到编辑权限受限&#xff0c;可开case咨询或申请…
阅读更多...
LeetCode.2129. 将标题首字母大写

LeetCode.2129. 将标题首字母大写

&#x1f354;题目 2129. 将标题首字母大写 &#x1f35f;分析 这道题目描述的很清晰&#xff0c;我们只需要将给定的字符串按照空格划分成字符串数组 str&#xff0c;然后判断 str[i] 的长度如果 <2 &#xff0c;则将 str[i] 转为小写&#xff0c;如果 str[i] 的长度 &g…
阅读更多...
JVM 面试题

JVM 面试题

1、什么情况下会发生栈内存溢出。 栈内存溢出通常发生在以下几种情况中&#xff1a; 函数递归调用过深&#xff1a; 当函数递归调用自身且没有合适的退出条件时&#xff0c;每次递归调用都会在栈上分配一个新的栈帧来存储局部变量、返回地址等信息。如果递归层次过多&#xff…
阅读更多...
[数据集][图像分类]棉花叶子病害分类数据集2293张4类别

[数据集][图像分类]棉花叶子病害分类数据集2293张4类别

数据集类型&#xff1a;图像分类用&#xff0c;不可用于目标检测无标注文件 数据集格式&#xff1a;仅仅包含jpg图片&#xff0c;每个类别文件夹下面存放着对应图片 图片数量(jpg文件个数)&#xff1a;2293 分类类别数&#xff1a;4 类别名称:["diseased_cotton_leaf"…
阅读更多...
基于多源信息融合的巡飞弹对地目标识别与毁伤评估

基于多源信息融合的巡飞弹对地目标识别与毁伤评估

源自&#xff1a;系统仿真学报 作者&#xff1a;徐艺博 于清华 王炎娟 郭策 冯世如 卢惠民 摘 要 面向利用多枚巡飞弹对地面高防御移动目标进行打击的任务场景&#xff0c;提出一种基于多源信息融合的巡飞弹对地移动目标识别与毁伤评估方法。基于IoU判定实现红外图像与可…
阅读更多...
E2697A 安捷伦高阻抗适配器

E2697A 安捷伦高阻抗适配器

181/2461/8938描述: E2697A高阻抗适配器允许将需要高阻抗输入的探头&#xff08;例如无源探头、电流探头&#xff09;连接到Infiniium 54850、80000和90000系列高性能示波器。E2697A高阻抗适配器扩展了Agilent Infiniium高性能示波器的功能&#xff0c;使其成为电源、逆变器、…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023