前端Web开发HTML5+CSS3+移动web视频教程 Day3 CSS 第1天

P29 - P43

从此开始进入 CSS 的学习。前面都是 HTML 的学习。

CSS 的作用：美化。

HTML 只是规定了网页内容有哪些，在网页中显示的位置默认是从上到下显示，还带有默认效果，比如超链接有颜色有下划线，无序列表有小圆点。想要把这些内容变得更加漂亮，就需要 CSS。所以在制作网页时，既需要 HTML 又需要 CSS。

Day 3 主要学习基础选择器和文字控制属性。

基础选择器的作用就是找标签，想要美化内容就要先找到这个内容再去美化，就用选择器去找这个内容。

选择器是很多的，今天先从基础选择器开始学习。

文字控制属性是用来控制文字的外观，比如文字的颜色、大小等等。

在这里插入图片描述

CSS 初体验

用 CSS 美化内容其实就是给内容加样式而已。

CSS 有多种写法，比较容易上手的一种写法是直接将 CSS 放到 HTML 中，放到 head 标签里面，title 标签下面。

CSS 代码是给浏览器看的，浏览器解释翻译完了在网页上呈现给用户看。

既然是给浏览器看的，那么就要放到 head 标签里面，习惯上放到 title 标签下面。

现在要将 CSS 放到 HTML 内部，而 CSS 和 HTML 是两种语言，要想让 CSS 打入 HTML 内部，就需要在 HTML 的 head 标签内部，title 标签下部，添加 style 标签，在 style 标签内部去写 CSS 既可。

CSS 代码都是由选择器加大括号组成。选择器的作用是找目标标签，要美化谁就用选择器去找谁既可。

CSS 属性的写法是：

属性名:属性值;

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>01-初始css</title><style>/* 这里是CSS注释了，而不是HTML注释 *//* CSS 代码 *//* 选择器 {CSS 属性} *//* 属性名和属性值成对出现 → 键值对 */p {/* 文字颜色 */color: red;/* 文字大小，即字号 */font-size: 30px;}</style>
</head>
<body><p>初识 CSS</p>
</body>
</html>

效果：

在这里插入图片描述

CSS 引入方式

在这里插入图片描述

CSS 有三个常见的书写位置。

rel: relationship

href: hipertext reference

实际工作中，一般都是用外部样式表。

程序示例：

HTML 代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>02-CSS引入方式</title><link rel="stylesheet" href="./my.css">
</head>
<body><p>这是 p 标签</p><!-- 行内写法 style = " CSS 属性" --><div style="color: green; font-size: 30px;">这是 div 标签</div>
</body>
</html>

CSS 代码：

/* 这个文件放 CSS 代码 */
/* 选择器 { CSS 属性} */
p {color: red;
}

效果：

在这里插入图片描述

选择器

在这里插入图片描述

标签选择器

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>03-标签选择器</title><style>/* 特点：选中同名标签设置相同的样式，说明无法差异化同名标签的样式 */p {color: blue;}</style>
</head>
<body><p>这是 p 标签。</p><p>111111</p><p>222222</p>
</body>
</html>

效果：

在这里插入图片描述

类选择器

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>04-类选择器</title><style>.red{color: red;}.size{font-size: 50px;}</style>
</head>
<body><p>11111</p><!-- 一个类选择器可以给多个标签使用 --><p class="red">22222</p><!-- 一个标签可以使用多个类名，class 属性值写多个类名，类名用空格隔开 --><div class="red size">3333333</div>
</body>
</html>

效果：

在这里插入图片描述

id 选择器

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>05-id选择器</title><style>#red {color: red;}</style>
</head>
<body><div id="red">这是 div 标签。</div>
</body>
</html>

效果：

在这里插入图片描述

通配符选择器

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>06-通配符选择器</title><style>*{color: red;}</style>
</head>
<body><p>这是 p 标签。</p><div>这是 div 标签。</div><h1>这是 h1 标签。</h1>
</body>
</html>

效果：

在这里插入图片描述

小练习

在这里插入图片描述

代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>07-画盒子</title><style>.div1 {width: 100px;height: 100px;background-color: brown;}.div2 {width: 200px;height: 200px;background-color: orange;}</style>
</head>
<body><div class="div1">div1</div><div class="div2">div2</div>
</body>
</html>

效果：

在这里插入图片描述

文字控制属性

文字控制属性的作用是美化文字。

在这里插入图片描述

字体大小

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>08-字体大小</title><style>/* 谷歌浏览器文字默认大小是16px */p {/* font-size 属性必须要有单位，否则属性不生效 */font-size: 30px;}</style>
</head>
<body><p>测试字体大小。</p><div>测试默认字体大小。</div>
</body>
</html>

效果：

在这里插入图片描述

调出浏览器的调试工具的方法：在网页任意位置，右键：

在这里插入图片描述

出现的这个面板叫做浏览器的调试工具：

在这里插入图片描述

点击左上角的这个小箭头，使其处于高亮状态：

在这里插入图片描述

将鼠标放置在想要查看格式的位置，不要点击，只需要将鼠标放在这个位置既可。

在这里插入图片描述

可以看出，文字大小确实是 16px。

字体粗细

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>09-字体粗细</title><style>h3 {font-weight: 400;}div {font-weight: 700;}</style>
</head>
<body><h3>h3 标题</h3><div>div 标签</div>
</body>
</html>

效果：

在这里插入图片描述

字体倾斜

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>10-字体倾斜</title><style>em{font-style: normal;}div {font-style: italic;}</style>
</head>
<body><em>em 标签。</em><div>div 标签。</div>
</body>
</html>

效果：

在这里插入图片描述

行高

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>11-行高</title><style>p {/* line-height: 30px; */line-height: 2;}</style>
</head>
<body><p>一百五十名警察和侦探包围了他那位于顶层的藏身之处，这些警察在房顶上凿孔，他们试图用催泪瓦斯把克劳利——这位杀害警察的人——熏出来。接着警察把机关枪架设在周围的建筑物上，在超过一小时的时间内，这一处纽约市的高档住宅区之一，回响起啪啪的手枪声和嗒嗒嗒的机枪声。克劳利蜷缩在一个沙发后面不停地向警察射击，当时有上万激动的群众围观这一战斗场面。以前在纽约市的街道上从来没有上演过这样的一幕。</p>
</body>
</html>

效果：

在这里插入图片描述

在这里插入图片描述

行高按照定义，是一行文字的高度加上该行文字的上间距和该行文字的下间距，每一行文字的上间距都是相同的，每一行文字的下间距都是相同的，所以行高也等于一行文字的高度加上该行文字的下间距再加上该行文字的下一行文字的上间距，也就是一行文字的顶部到下一行文字的顶部，当然也等于一行文字的底部到下一行文字的底部。

行高 - 垂直居中

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>12-行高-垂直居中</title><style>div {height: 100px;background-color: skyblue;/* 注意：只能是单行文字垂直居中 *//* 如果是多行文字，只需要加行高，拉开两行文字之间的距离既可 */line-height: 100px;}</style>
</head>
<body><div>文字</div>
</body>
</html>

效果：

在这里插入图片描述

字体

在这里插入图片描述

无衬线字体：sans-serif

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>13-字体族</title><style>div {font-family: 楷体;}</style>
</head>
<body><div>字体族</div>
</body>
</html>

效果：

在这里插入图片描述

font 复合属性

在这里插入图片描述

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>14-font属性</title><style>/* 文字倾斜、文字加粗、字体大小是 30px，行高 2 倍，楷体 */div {font: italic 700 30px/2 楷体;}</style>
</head>
<body><div>测试 font 属性</div>
</body>
</html>

效果：

在这里插入图片描述

文本缩进

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>15-文本缩进</title><style>p {text-indent: 2em;font-size: 20px;}</style>
</head>
<body><p>推开丁仪那套崭新的三居室的房门，汪淼闻到了一股酒味，看到丁仪躺在沙发上，电视开着，他的双眼却望着天花板。汪淼四下打量了一下，看到房间还没怎么装修，也没什么家具和陈设，宽大的客厅显得很空，最显眼的是客厅一角摆放的一张台球桌。汪淼在浏览器的地址栏中输入那个很容易记住的游戏网址：www.threebody.com，网页上显示该游戏只支持V装具方式。汪淼想起了纳米中心的职工娱乐室里好像有一套V装具，就走出已经空荡荡的中心实验大厅，去值班室要了钥匙，在娱乐室中穿过一排台球桌和健身器材，在一台电脑旁找到了V装具，费了很大劲才把感应服穿上，然后戴上显示头盔，启动电脑。荒原依旧，但V装具感应服中的压缩机咝咝地启动了，汪淼感到一股逼人的寒气。前方出现了两个行走的人影，在曙光的背景前呈黑色的剪影。汪淼追了上去，他看到两人都是男性，披着破烂的长袍，外面还裹着一张肮脏的兽皮，都带着一把青铜时代那种又宽又短的剑，其中一人背着一只有他一半高的细长的木箱子。那人扭头看看汪淼，他的脸像那兽皮一样脏和皱，双眼却很有神，眸子映着曙光。“冷啊。”他说。</p>
</body>
</html>

效果：

在这里插入图片描述

文本对齐方式

在这里插入图片描述

text-align 这个属性调整的是内容的对齐方式，不影响标签的位置。即改变的文字内容的位置而不是改变了标签的位置。

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>16-文本对齐方式</title><style>h1 {text-align: center;}</style>
</head>
<body><h1>标题文字</h1>
</body>
</html>

效果：

在这里插入图片描述

图片对齐方式

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>17-图片对齐方式</title><style>div {text-align: center;}</style>
</head>
<body><div><img src="./images/1.jpg" alt=""></div>
</body>
</html>

效果：

在这里插入图片描述

文本修饰线

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>18-文本修饰线</title><style>a {text-decoration: none;}div {text-decoration: underline;}p {text-decoration: line-through;}span {text-decoration: overline;}</style>
</head>
<body><a href="#">a 标签，去掉下划线</a><div>div 标签，添加下划线</div><p>p 标签，添加删除线</p><span>span 标签，添加顶划线</span>
</body>
</html>

效果：

在这里插入图片描述

color 文字颜色

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>19-文字颜色</title><style>h1{color: red;}h2{color: rgb(0, 255, 0);}h3{/* 0 表示完全透明，1 表示完全不透明 */color: rgba(0, 255, 0, 0.5);}h4 {/* 6 位可以简写为 3 位，相同的两位可以只写一个 */color: #0000ff;/* 相当于 00f */}</style>
</head>
<body><h1>h1 标签</h1><h2>h2 标签</h2><h3>h3 标签</h3><h4>h4 标签</h4>
</body>
</html>

效果：

在这里插入图片描述

调试工具 - 谷歌浏览器

在这里插入图片描述

程序示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>20-调试工具</title><style>div {color: red;font-size: 40; /* 没有单位 px，是不起作用的 */}</style>
</head>
<body><div>调试文字</div>
</body>
</html>

效果：

在这里插入图片描述

在这里插入图片描述

上面部分是 HTML 代码，下面部分是作用在这部分 HTML 代码上的 CSS 代码。

将代码修改正确后，刷新网页。

在这里插入图片描述

在这里插入图片描述

综合案例一：新闻详情

在这里插入图片描述

代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>21-综合案例 —— 新闻详情</title><style>h1{text-align: center;font-weight: 400;font-size: 30px;color: #333;}div {text-align: center;}.color{color: #999;}.color2 {color: #333;}.indent {text-indent: 2em;}.size1{font-size: 14px}.size2{font-size: 18px}div {color: #999;font-size: 14px}.pic {text-align: center;}</style>
</head>
<body><h1>在希望的田野上 | 湖北秋收开镰 各地多举措保增产增收</h1><p class="color size1">来源：央视网 | 2222年12月12日 12:12:12</p><!-- <div>来源：央视网 | 2222年12月12日 12:12:12</div> --><p class="indent size2 color2"><strong>央视网消息：</strong>眼下，湖北省秋收开镰已有一周多的时间。水稻收割已经超过四成，玉米收割七成。湖北省通过大力推广新品种水稻，建设高标准农田等一系列措施，为秋粮稳产提供有力支撑。</p><p class="indent size2 color2">中稻占据了湖北全年粮食产量的一半以上。在湖北的主产区荆门市，370万亩中稻已经收割四成以上。</p><div class="pic"><img src="./1.jpg" alt=""></div><p class="indent size2 color2">王化林说的新品种，是湖北省研发的杂交水稻“华夏香丝”，不仅产量高，还具有抗病、抗倒、抗高温的特性。在荆门漳河镇的一工程示范田内，像“华夏香丝”这样抗旱节水的品种还有20多个，这些水稻新品将在荆门全面推广，确保来年增产增收。</p><p class="indent size2 color2">此外，湖北还大力推进高标准农田建设。截至今年6月，已建成3980万亩高标准农田。目前，湖北全省仍有1800多万亩中稻正在有序收割中，预计10月中旬收割完毕。</p>
</body>
</html>

综合案例二：CSS 简介

在这里插入图片描述

代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>22-综合案例二：CSS 简介</title><style>h1 {color: #333;}p {color: #444;text-indent: 2em;font-size: 14px;line-height: 30px;}a {color: #0069c2;}li {color: #444;font-size: 14px;line-height: 30px;}</style>
</head>
<body><h1>CSS（层叠样式表）</h1><p>层叠样式表（Cascading Style Sheets，缩写为 CSS），是一种 <a href="#">样式表</a> 语言，用来描述 HTML 或 XML（包括如 SVG、MathML、XHTML 之类的 XML 分支语言）文档的呈现。CSS 描述了在屏幕、纸质、音频等其它媒体上的元素应该如何被渲染的问题。</p><p><strong>CSS 是开放网络的核心语言之一，</strong>由 W3C 规范 实现跨浏览器的标准化。CSS 节省了大量的工作。 样式可以通过定义保存在外部.css 文件中，同时控制多个网页的布局，这意味着开发者不必经历在所有网页上编辑布局的麻烦。CSS 被分为不同等级：CSS1 现已废弃， CSS2.1 是推荐标准， CSS3 分成多个小模块且正在标准化中。</p><ul><li>CSS 介绍 如果你是 Web 开发的新手，请务必阅读我们的 CSS 基础 文章以学习 CSS 的含义和用法。</li><li>CSS 教程 我们的 CSS 学习区 包含了丰富的教程，它们覆盖了全部基础知识，能使你在 CSS 之路上从初出茅庐到游刃有余。</li><li>CSS 参考 针对资深 Web 开发者的 <a href="#">详细参考手册</a> ，描述了 CSS 的各个属性与概念。</li></ul>
</body>
</html>

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

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

相关文章

CSS Flex弹性布局

CSS Flex弹性布局

一、传统布局与flex布局 1、传统布局 2、flex布局 二、flex布局原理 1、布局原理 2、flex布局体验 三、flex布局父项常见属性 1、常见的父项属性 2、flex-direction设置主轴的方向 3、justify-content 设置主轴上的子元素排列方式 4、flex-wrap 设置子元素是否换行 …
阅读更多...
同步的问题及解决方案

同步的问题及解决方案

同步 同步的问题 当给狗狗食物的同时，狗狗又在吃，这会导致在运行过程中会出现食物的数据的错乱，有时候会多出数据，有时候会少出数据，这就让狗狗有时候会很吃亏，那么该如何解决呢？ 实验体现 package multiThread2;public class Animal{private String name;private int…
阅读更多...
电影票房预测管理系统设计

电影票房预测管理系统设计

电影票房预测管理系统的开发涉及多个层面的设计&#xff0c;包括但不限于数据收集、数据分析、预测模型构建、用户界面设计和系统集成。以下是一个基本的系统设计框架&#xff1a; 1. 数据收集模块&#xff1a;这是整个系统的基础。需要收集的数据可能包括历史票房数据、上映电…
阅读更多...
docker离线安装部署

docker离线安装部署

docker离线安装部署 下载资源包 wget https://download.docker.com/linux/static/stable/x86_64/docker-20.10.0.tgzwget https://download.docker.com/linux/static/stable/x86_64/docker-24.0.6.tgz安装 #1、解压dockertar -zxvf docker-24.0.6.tgz#2、将解压之后的docker文…
阅读更多...
2024年6月GESP认证图形化编程_Python_C++真题及答案

2024年6月GESP认证图形化编程_Python_C++真题及答案

2024年6月CCF GESP认证图形化编程_Python_C真题及答案 GESP 6月认证图形化编程一级真题 GESP 6月认证图形化编程二级真题 GESP 6月认证图形化编程三级真题 GESP 6月认证图形化编程四级真题 GESP 6月认证 C 一级真题 GESP 6月认证 C 二级真题 GESP 6月认证 C 三级真题 GE…
阅读更多...
HTML 纯页面商城（简易版）

HTML 纯页面商城（简易版）

index.html ---- <!DOCTYPE html> <html lang"zh"> <head> <meta charset"UTF-8"> <meta name"viewport" content"widthdevice-width, initial-scale1.0"> <title>购物商城</ti…
阅读更多...
Memcached安装与配置：从零开始搭建高效缓存系统

Memcached安装与配置：从零开始搭建高效缓存系统

Memcached 是一个高性能、分布式内存对象缓存系统&#xff0c;用于加速动态Web应用程序&#xff0c;减轻数据库负载。本文将详细介绍如何从零开始安装和配置Memcached&#xff0c;以搭建一个高效的缓存系统。 1. Memcached简介 Memcached 是一个开源的内存缓存系统&#xff0…
阅读更多...
二叉树从根节点出发的所有路径

二叉树从根节点出发的所有路径

二叉树从根节点出发的所有路径 看上图中 二叉树结构 从根节点出发的所有路径 如下 6->4->2->1 6->4->2->3 6->4->5 6->8->7 6->8->9 逻辑思路&#xff1a; 按照先序遍历 加 回溯法 实现 代码如下 // 调用此方法&#xff0c;将根节点传递…
阅读更多...
上位机图像处理和嵌入式模块部署（mcu 项目1：上位机编写）

上位机图像处理和嵌入式模块部署（mcu 项目1：上位机编写）

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 前面&#xff0c;我们说过要做一个报警器。如果只是简单做一个报警器呢&#xff0c;这个基本上没有什么难度。这里&#xff0c;我们就适当提高一下…
阅读更多...
Navicat上新啦

Navicat上新啦

前言 Navicat&#xff0c;在数据库界&#xff0c;几乎是一个神奇的存在&#xff0c;似乎统治了数据库开发工具的“一片天”。且看下图&#xff1a; 红的蓝的绿的橙的…&#xff0c;可以说&#xff0c;留给它的color不多了。 那么商业BI到服务监控、从云托管到云协作&#xff…
阅读更多...
短剧App开发的全攻略

短剧App开发的全攻略

短剧App开发的全攻略可以概括为以下几个关键步骤&#xff1a; 1、市场调研与需求分析 进行市场调研&#xff0c;研究目标用户群体&#xff0c;了解他们的需求和偏好。 观察竞争对手的App&#xff0c;分析他们的优点和缺点&#xff0c;以此为基础来制定自己的开发计划。 确定App…
阅读更多...
Apipost接口测试工具的原理及应用详解（一）

Apipost接口测试工具的原理及应用详解（一）

本系列文章简介&#xff1a; 随着软件行业的快速发展&#xff0c;API&#xff08;应用程序编程接口&#xff09;作为不同软件组件之间通信的桥梁&#xff0c;其重要性日益凸显。API的质量直接关系到软件系统的稳定性、性能和用户体验。因此&#xff0c;对API进行严格的测试成为…
阅读更多...
Zookeeper节点ACL权限设置—digest模式

Zookeeper节点ACL权限设置—digest模式

ACL全称为Access Control List&#xff08;访问控制列表&#xff09;&#xff0c;用于控制资源的访问权限。ZooKeeper使用ACL来控制对其znode&#xff08;ZooKeeper数据树的数据节点&#xff09;的访问。 zk利用ACL策略控制节点的访问权限: CREATE c 可以创建子节点 DELETE …
阅读更多...
锅炉引风机控制系统原理

锅炉引风机控制系统原理

锅炉引风机控制系统原理 引言 现有的锅炉由蒸汽锅炉改造而成的常压热水锅炉，常压锅炉使用安全，对原材料的要求比蒸汽锅炉低，无需控制蒸汽压力，控制精度要求相对要低。目前国内外对蒸汽锅炉引风机控制的研究己经比较成熟，锅炉引风机控制数学模型基本定型，而锅炉引风机控…
阅读更多...
2114. 句子中的最多单词数

2114. 句子中的最多单词数

一个 句子 由一些 单词 以及它们之间的单个空格组成&#xff0c;句子的开头和结尾不会有多余空格。 给你一个字符串数组 sentences &#xff0c;其中 sentences[i] 表示单个 句子 。 请你返回单个句子里 单词的最多数目 。 示例 1&#xff1a; 输入&#xff1a;sentences […
阅读更多...
3D打印随形水路在注塑生产中的显著优势

3D打印随形水路在注塑生产中的显著优势

3D打印技术在模具制造中已崭露头角&#xff0c;特别是在注塑生产中&#xff0c;3D打印随形水路的应用正变得日益普遍。 首先&#xff0c;该技术能精准优化模具温度。3D打印随形水路随形冷却的设计让模具温度更加均匀&#xff0c;水路更贴近产品&#xff0c;有效提升产品品质和缩…
阅读更多...
python基础问题记录

python基础问题记录

文章目录 前言一、python中类的注意点二、模块与包1. 模块2. 包 总结 前言 本专栏主要记录python中一些语法问题。 一、python中类的注意点 类属性&#xff1a;在类中定义的属性 在类中直接写明的变量是类属性&#xff0c;属于公共属性。 访问&#xff1a;类属性可以通过类或…
阅读更多...
k8s如何使用 HPA 实现自动扩展

k8s如何使用 HPA 实现自动扩展

使用Horizontal Pod Autoscaler (HPA) 实验目标&#xff1a; 学习如何使用 HPA 实现自动扩展。 实验步骤&#xff1a; 创建一个 Deployment&#xff0c;并设置 CPU 或内存的资源请求。创建一个 HPA&#xff0c;设置扩展策略。生成负载&#xff0c;观察 HPA 如何自动扩展 Pod…
阅读更多...
redis实战-缓存穿透问题及解决方案

redis实战-缓存穿透问题及解决方案

定义理解 缓存穿透&#xff1a;缓存穿透是指客户端请求的数据在缓存中和数据库中都不存在&#xff0c;这样缓存永远都不会生效&#xff08;只有数据库查到了&#xff0c;才会让redis缓存&#xff0c;但现在的问题是查不到&#xff09;&#xff0c;会频繁的去访问数据库。 解决…
阅读更多...
JavaScript——条件和赋值运算符

JavaScript——条件和赋值运算符

目录 任务描述 相关知识 条件运算符 赋值运算符 编程要求 任务描述 本关任务&#xff1a;计算并返回两个字符串中较大的字符串。字符串的大小比较直接使用比较运算符>或者<即可。 例如&#xff1a;对于字符串 aa 和 ab&#xff0c;要求返回 ab 。 相关知识 条件运…
阅读更多...
最新文章

Copyright @ 2022~2023