小菜鸟

CSS 基础使用与元素显示模式详解

CSS（层叠样式表）是控制网页布局和样式的核心技术，而理解 HTML 元素的显示模式（块状、行内、行内块状）是掌握 CSS 布局的基础。本文将从 “元素显示模式分类→核心样式用法→实战场景” 三个维度，详解块状元素、行内元素、行内块状元素的特性与应用，并结合 overflow、list-style 等基础样式，帮助你建立 CSS 布局的核心概念。

CSS 基础样式快速入门

在深入元素显示模式前，先掌握两个实用 CSS 样式的具体用法和场景：

1. overflow: hidden：控制内容溢出

当元素内容超出其指定尺寸（宽度 / 高度）时，overflow: hidden 会隐藏超出部分，避免内容 “溢出” 到其他元素区域，破坏布局。

核心作用：

• 裁剪超出元素边界的内容（文字、图片等）；
• 清除浮动（float）带来的父元素高度塌陷问题（经典布局技巧）。

示例：防止文字溢出

1
2
3
4
5
6
7
8
9
10
11
12
13

<style>
  .box {
    width: 150px;
    height: 80px;
    border: 1px solid #ccc;
    /* 隐藏超出的内容 */
    overflow: hidden;
  }
</style>

<div class="box">
  这是一段超长的文字内容，用于演示 overflow: hidden 的效果。当内容超过元素的宽度和高度时，超出部分会被隐藏。
</div>

效果：

文字仅显示在 150×80px 的盒子内，超出部分被裁剪（不显示滚动条）。

其他常用取值：

• overflow: auto：内容溢出时显示滚动条，未溢出时不显示；
• overflow: scroll：强制显示滚动条（无论内容是否溢出）；
• overflow-x/overflow-y：单独控制水平 / 垂直方向的溢出行为（如 overflow-y: auto）。

2. list-style: none：清除列表默认样式

浏览器会为 <ul>/<ol> 列表添加默认标记（如圆点、数字）和缩进，list-style: none 可清除这些默认样式，让列表呈现 “无标记、无缩进” 的状态，便于自定义列表样式（如导航菜单）。

示例：清除列表默认样式

JavaScript window.open() 详解：打开新窗口的用法、参数与实战

window.open() 是浏览器提供的核心 API，用于在新窗口或现有框架中加载指定 URL，广泛应用于 “新窗口打开页面”“弹出层”“文件下载窗口” 等场景。从 “语法详解→参数解析→实战场景→注意事项” 四个维度，全面讲解 window.open() 的使用方法与进阶技巧。

核心语法与基础概念

1. 基本语法

1

window.open(url, name, args);

• 返回值：返回新窗口的 Window 对象（可通过该对象操作新窗口，如关闭、修改内容）；若浏览器阻止弹出窗口，返回 null。

• 参数说明：

  | 参数名 | 类型 | 可选性 | 核心作用 |
  | ——— | ——— | ——— | —————————————————————————————— |
  | url | 字符串 | 可选 | 要加载的 URL（如 https://www.example.com）；若为 null/ 空字符串，打开空白窗口。 |
  | name | 字符串 | 可选 | 新窗口的名称（或目标框架名），用于标识窗口，决定 URL 加载位置。 |
  | args | 字符串 | 可选 | 新窗口的配置参数（如尺寸、位置、是否显示工具栏等），参数间用逗号分隔。 |

2. 关键概念：name 参数的作用

name 参数不仅是新窗口的 “标识”，还决定了 URL 加载的目标位置，支持预定义值和自定义名称，核心取值如下：

args 参数详解：配置新窗口样式

args 参数是可选的字符串，用于定义新窗口的外观和行为，支持多个配置项（用逗号分隔，无空格），常见配置如下表：

Kafka 核心配置文件详解：server.properties

Kafka 的配置文件是控制集群行为的核心，其中 server.properties 是 Broker 节点的主配置文件，包含了 Broker 身份、网络、存储、日志、ZooKeeper 连接等关键参数。理解这些配置有助于优化 Kafka 性能、确保可靠性，并根据业务场景进行定制。本文将逐节解析 server.properties 中的核心配置项。

Server Basics（服务器基础配置）

1. broker.id

• 作用：Broker 节点的唯一标识，在集群中必须唯一。
• 默认值：0
• 说明：
  • 集群中每个 Broker 需配置不同的 broker.id（如 0、1、2…）。
  • 若启用动态 Broker ID（broker.id.generation.enable=true），可自动生成 ID，无需手动配置。

2. delete.topic.enable

• 作用：控制是否允许删除主题（Topic）。
• 默认值：false（不允许删除）
• 说明：
  • 生产环境建议设为 true，方便清理无用主题。
  • 主题删除后，相关数据（日志文件、ZooKeeper 元数据）会被彻底删除，操作不可逆。

Socket Server Settings（网络配置）

1. listeners

• 作用：指定 Broker 监听客户端连接的地址和协议。

• 默认值：未配置（默认监听 PLAINTEXT://0.0.0.0:9092）

• 格式：listener_name://host:port

• 示例：

  1	listeners=PLAINTEXT://localhost:9092,SSL://localhost:9093

  表示同时支持明文（PLAINTEXT）和 SSL 加密连接。

Spark Streaming转换操作详解：无状态与有状态处理

Spark Streaming 的转换操作是流数据处理的核心，分为无状态转换和有状态转换两大类。无状态转换仅依赖当前批次数据，而有状态转换需结合历史批次数据或滑动窗口内的数据。本文将深入解析两类转换的原理、用法及实战案例，帮助你掌握流数据的复杂处理逻辑。

转换操作概述

无状态 vs 有状态转换

• 无状态转换：每个批次的数据处理独立于其他批次，仅基于当前输入（如 map、filter）；
• 有状态转换：处理依赖历史数据或跨批次的上下文信息，需维护中间状态（如累计计数、滑动窗口统计）。

核心区别与适用场景

无状态转换（Stateless Transformations）

无状态转换与 RDD 转换操作类似，每个批次的数据独立处理，不依赖历史结果。常用操作包括 map、flatMap、filter、reduceByKey 等。

常用无状态转换操作

实战案例：实时单词计数（无状态）

对每个批次的输入文本进行单词计数，不累计历史结果：

Spark Streaming自定义数据源：扩展流处理的灵活性

Spark Streaming 内置了 Kafka、Flume、TCP 等常用数据源，但在实际业务中，常需对接自定义系统（如专有消息队列、硬件设备数据流）。此时，通过自定义 Receiver 扩展数据源成为关键能力。本文将详细解析自定义数据源的实现原理、开发步骤及实战案例，帮助你灵活扩展 Spark Streaming 的数据输入能力。

自定义数据源的核心原理

为什么需要自定义数据源？

• 业务特殊性：需对接企业内部私有系统（如自研消息中间件、IoT 设备流）；
• 数据格式适配：处理非标准格式数据（如二进制协议、加密数据流）；
• 特殊采集逻辑：需在数据采集阶段添加过滤、转换等预处理逻辑。

Receiver 机制的作用

Spark Streaming 通过 Receiver 组件从外部数据源接收数据，其核心职责是：

• 数据采集：连接外部数据源，持续接收数据；
• 数据持久化：将数据存储到 Spark 内存（或磁盘），供后续处理；
• 容错保障：配合 Checkpoint 机制实现数据不丢失。