OzanShareing
OzanShareing

Bootstrap 布局组件（一）

1. Bootstrap 字体图标(Glyphicons)

Bootstrap 捆绑了 200 多种字体格式的字形。首先让我们先来理解一下什么是字体图标。

1.1 什么是字体图标？

字体图标是在 Web 项目中使用的图标字体。虽然，Glyphicons Halflings 需要商业许可，但是您可以通过基于项目的 Bootstrap 来免费使用这些图标。

为了表示对图标作者的感谢，希望您在使用时加上 GLYPHICONS 网站的链接。

1.2 获取字体图标

相关的 CSS 规则写在 dist 文件夹内的 css 文件夹内的 bootstrap.css 和 bootstrap-min.css 文件上。

1.2.1 字体图标列表

点击这里，查看可用的字体图标列表。

1.3 用法

如需使用图标，只需要简单地使用下面的代码即可。请在图标和文本之间保留适当的空间。

展示结果如下：

1.4 带有字体图标的导航栏

运行结果如下：

1.5 定制字体图标

我们已经看到如何使用字体图标，接下来我们看看如何定制字体图标。
我们将以上面的实例开始，并通过改变字体尺寸、颜色和应用文本阴影来进行定制图标。
下面是开始的代码：

1.5.1 定制字体尺寸

通过增加或减少图标的字体尺寸，您可以让图标看起来更大或更小。
Bootstrap 布局组件（一）_第1张图片

1.5.2 定制字体颜色

1.5.3 应用文本阴影

1.5.4 在线定制字体

点击这里，定制字体图标 »

2. Bootstrap 下拉菜单（Dropdowns）

下拉菜单是可切换的，是以列表格式显示链接的上下文菜单。这可以通过与 下拉菜单（Dropdown） JavaScript 插件 的互动来实现。

如需使用下拉菜单，只需要在 class .dropdown 内加上下拉菜单即可。下面的实例演示了基本的下拉菜单：

展示结果如下：

Bootstrap 布局组件（一）_第2张图片

2.1 选项

2.1.1 对齐

通过向 .dropdown-menu 添加 class .pull-right 来向右对齐下拉菜单。下面的实例演示了这点：
Bootstrap 布局组件（一）_第3张图片

2.1.2 标题

您可以使用 class dropdown-header 向下拉菜单的标签区域添加标题。下面的实例演示了这点：
Bootstrap 布局组件（一）_第4张图片

2.2 更多实例

类 描述 实例
.dropdown 指定下拉菜单，下拉菜单都包裹在 .dropdown 里 尝试一下
.dropdown-menu 创建下拉菜单 尝试一下
.dropdown-menu-right 下拉菜单右对齐 尝试一下
.dropdown-header 下拉菜单中添加标题 尝试一下
.dropup 指定向上弹出的下拉菜单 尝试一下
.disabled 下拉菜单中的禁用项 尝试一下
.divider 下拉菜单中的分割线 尝试一下

3. Bootstrap 按钮组

按钮组允许多个按钮被堆叠在同一行上。当你想要把按钮对齐在一起时，这就显得非常有用。您可以通过 Bootstrap 按钮（Button） 插件 添加可选的 JavaScript 单选框和复选框样式行为。

3.1 基本的按钮组

下面的实例演示了上面表格中讨论到的 class .btn-group 的使用：

3.2 按钮工具栏

3.3 按钮的大小

3.4 嵌套

当您想让下拉菜单与一系列按钮组合使用时，就会用到这个。

3.5 垂直的按钮组
Bootstrap 布局组件（一）_第5张图片

4. Bootstrap 按钮下拉菜单

如需向按钮添加下拉菜单，只需要简单地在在一个 .btn-group 中放置按钮和下拉菜单即可。您也可以使用 来指示按钮作为下拉菜单。

下面的实例演示了一个基本的简单的按钮下拉菜单

4.1 分割的按钮下拉菜单

分割的按钮下拉菜单使用与下拉菜单按钮大致相同的样式，但是对下拉菜单添加了原始的功能。分割按钮的左边是原始的功能，右边是显示下拉菜单的切换。

4.2 按钮下拉菜单的大小

您可以使用带有各种大小按钮的下拉菜单：.btn-lg、.btn-sm 或 .btn-xs。

4.3 按钮上拉菜单

菜单也可以往上拉伸的，只需要简单地向父 .btn-group 容器添加 .dropup 即可。
Bootstrap 布局组件（一）_第6张图片

5. Bootstrap 输入框组

输入框组扩展自 表单控件。使用输入框组，您可以很容易地向基于文本的输入框添加作为前缀和后缀的文本或按钮。

通过向输入域添加前缀和后缀的内容，您可以向用户输入添加公共的元素。例如，您可以添加美元符号，或者在 Twitter 用户名前添加 @，或者应用程序接口所需要的其他公共的元素。

向 .form-control 添加前缀或后缀元素的步骤如下：

  • 把前缀或后缀元素放在一个带有 class .input-group 的
    中。
  • 接着，在相同的
    内，在 class 为 .input-group-addon 的 内放置额外的内容。
  • 把该 放置在 元素的前面或者后面。

为了保持跨浏览器的兼容性，请避免使用


.00

$ .00
Bootstrap 布局组件（一）_第7张图片

5.2 输入框组的大小

您可以通过向 .input-group 添加相对表单大小的 class（比如 .input-group-lg、input-group-sm）来改变输入框组的大小。输入框中的内容会自动调整大小。


    

        

            @
            
        

        

        

            @
            
        

        

        

            @
Bootstrap 布局组件（一）_第8张图片

5.3 复选框和单选插件

您可以把复选框和单选插件作为输入框组的前缀或者后缀元素，如下面的实例所示：

5.4 按钮插件

您也可以把按钮作为输入框组的前缀或者后缀元素，这个时候您就不是添加 .input-group-addon class，您需要使用 class .input-group-btn 来包裹按钮。这是必需的，因为默认的浏览器样式不会被重写。下面的实例演示了这点：

5.5 带有下拉菜单的按钮

在输入框组中添加带有下拉菜单的按钮，只需要简单地在一个 .input-group-btn class 中包裹按钮和下拉菜单即可，如下面的实例所示：

6. Bootstrap 导航元素

它们使用相同的标记和基类 .nav。Bootstrap 也提供了一个用于共享标记和状态的帮助器类。改变修饰的 class，可以在不同的样式间进行切换。

6.1 表格导航或标签

创建一个标签式的导航菜单：

  • 以一个带有 class .nav 的无序列表开始。
  • 添加 class .nav-tabs。
标签式的导航菜单

6.2 胶囊式的导航菜单

6.2.1 基本的胶囊式导航菜单

如果需要把标签改成胶囊的样式，只需要使用 class .nav-pills 代替 .nav-tabs 即可，其他的步骤与上面相同。

基本的胶囊式导航菜单

6.2.2 垂直的胶囊式导航菜单

您可以在使用 class .nav、.nav-pills 的同时使用 class .nav-stacked，让胶囊垂直堆叠。

垂直的胶囊式导航菜单
Bootstrap 布局组件（一）_第9张图片

6.3 两端对齐的导航

您可以在屏幕宽度大于 768px 时，通过在分别使用 .nav、.nav-tabs 或 .nav、.nav-pills 的同时使用 class .nav-justified，让标签式或胶囊式导航菜单与父元素等宽。在更小的屏幕上，导航链接会堆叠。

两端对齐的导航元素
Bootstrap 布局组件（一）_第10张图片

6.4 禁用链接

对每个 .nav class，如果添加了 .disabled class，则会创建一个灰色的链接，同时禁用了该链接的 :hover 状态，如下面的实例所示：

导航元素中的禁用链接
Bootstrap 布局组件（一）_第11张图片

6.5 下拉菜单

导航菜单与下拉菜单使用相似的语法。默认情况下，列表项的锚与一些数据属性协同合作来触发带有 .dropdown-menu class 的无序列表。

6.5.1 带有下拉菜单的标签

向标签添加下拉菜单的步骤如下：

  • 以一个带有 class .nav 的无序列表开始。
  • 添加 class .nav-tabs。
  • 添加带有 .dropdown-menu class 的无序列表。
带有下拉菜单的标签
Bootstrap 布局组件（一）_第12张图片

6.6 更多导航元素组件实例

6.6.1 标签页与胶囊式标签页

类 描述 实例
.nav nav-tabs 标签页 尝试一下
.nav nav-pills 胶囊式标签页 尝试一下
.nav nav-pills nav-stacked 胶囊式标签页以垂直方向堆叠排列的 尝试一下
.nav-justified 两端对齐的标签页，在大于 768px 的屏幕上，通过 .nav-justified 类可以很容易的让标签页或胶囊式标签呈现出同等宽度。在小屏幕上，导航链接呈现堆叠样式。 尝试一下
.disabled 禁用的标签页 尝试一下
标签添加下拉菜单 尝试一下
带下拉菜单的胶囊式标签页 尝试一下
.tab-content 与 .tab-pane 和 data-toggle="tab" (data-toggle="pill" ) 一同使用, 设置标签页对应的内容随标签的切换而更改 尝试一下
.tab-pane 与 .tab-content 和 data-toggle="tab" (data-toggle="pill")一同使用, 设置标签页对应的内容随标签的切换而更改 尝试一下

7. Bootstrap 导航栏

导航栏是一个很好的功能，是 Bootstrap 网站的一个突出特点。导航栏在您的应用或网站中作为导航页头的响应式基础组件。

导航栏在移动设备的视图中是折叠的，随着可用视口宽度的增加，导航栏也会水平展开。在 Bootstrap 导航栏的核心中，导航栏包括了站点名称和基本的导航定义样式。

7.1 默认的导航栏

创建一个默认的导航栏的步骤如下：

展示结果如下：

7.2 响应式的导航栏

为了给导航栏添加响应式特性，您要折叠的内容必须包裹在带有 class .collapse、.navbar-collapse 的

中。折叠起来的导航栏实际上是一个带有 class .navbar-toggle 及两个 data- 元素的按钮。

第一个是 data-toggle，用于告诉 JavaScript 需要对按钮做什么，第二个是 data-target，指示要切换到哪一个元素。

三个带有 class .icon-bar 的 创建所谓的汉堡按钮。这些会切换为 .nav-collapse

中的元素。为了实现以上这些功能，您必须包含 Bootstrap 折叠（Collapse）插件。

在手机上展示如下：

Bootstrap 布局组件（一）_第13张图片

当屏幕宽度小于一定程度时，导航条缩小，变成可折叠形式

7.3 导航栏中的表单

导航栏中的表单不是使用 Bootstrap 表单 中所讲到的默认的 class，它是使用 .navbar-form class。这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为。使用对齐方式选项（这将在组件对齐方式部分进行详细讲解）来决定导航栏中的内容放置在哪里。

7.4 导航栏中的按钮

您可以使用 class .navbar-btn 向不在

中的

7.5 导航栏中的文本

如果需要在导航中包含文本字符串，请使用 class .navbar-text。这通常与

标签一起使用，确保适当的前导和颜色。下面的实例演示了这点：

7.6 结合图标的导航链接

如果您想在常规的导航栏导航组件内使用图标，那么请使用 class glyphicon glyphicon-* 来设置图标，更多请查看 Bootstrap 图标 ，如下面的实例所示：

7.7 组件对齐方式

您可以使用实用工具 class .navbar-left 或 .navbar-right 向左或向右对齐导航栏中的 导航链接、表单、按钮或文本 这些组件。这两个class 都会在指定的方向上添加 CSS浮动。下面的实例演示了这点：

7.8 固定到顶部

ootstrap 导航栏可以动态定位。默认情况下，它是块级元素，它是基于在 HTML 中放置的位置定位的。通过一些帮助器类，您可以把它放置在页面的顶部或者底部，或者您可以让它成为随着页面一起滚动的静态导航栏。
如果您想要让导航栏固定在页面的顶部，请向 .navbar class 添加 class .navbar-fixed-top。下面的实例演示了这点：

为了防止导航栏与页面主体中的其他内容的顶部相交错，请向 标签添加至少 50 像素的内边距（padding），内边距的值可以根据您的需要进行设置。
Bootstrap 布局组件（一）_第14张图片

7.9 固定到底部

如果您想要让导航栏固定在页面的底部，请向.navbar class 添加 class.navbar-fixed-bottom。下面的实例演示了这点：
Bootstrap 布局组件（一）_第15张图片

7.10 静态的顶部

如需创建能随着页面一起滚动的导航栏，请添加 .navbar-static-top class。该 class 不要求向 添加内边距（padding）。

7.11 反色的导航栏

为了创建一个带有黑色背景白色文本的反色的导航栏，只需要简单地向 .navbar class 添加 .navbar-inverse class 即可，如下面的实例所示：
Bootstrap 布局组件（一）_第16张图片

你可能感兴趣的:(Bootstrap 布局组件（一）)

  • 系统学习Python——并发模型和异步编程：进程、线程和GIL
    分类目录：《系统学习Python》总目录在文章《并发模型和异步编程：基础知识》我们简单介绍了Python中的进程、线程和协程。本文就着重介绍Python中的进程、线程和GIL的关系。Python解释器的每个实例都是一个进程。使用multiprocessing或concurrent.futures库可以启动额外的Python进程。Python的subprocess库用于启动运行外部程序（不管使用何种
  • 为什么会出现“与此站点的连接不安全”警告？
    当浏览器弹出“与此站点的连接不安全”的红色警告时，不仅会让访客感到不安，还可能直接导致用户流失、品牌信誉受损，甚至引发数据泄露风险。作为网站运营者，如何快速解决这一问题？一、为什么会出现“与此站点的连接不安全”警告？浏览器提示“不安全连接”，本质上是检测到当前网站与用户之间的数据传输未经过加密保护。以下是触发警告的常见原因：1.未安装SSL证书SSL（SecureSocketsLayer）证书是网
  • 有必要获得WHQL测试认证吗，有什么好处？
    什么是WHQL认证？WHQL是MicrosoftWindowsHardwareQualityLab的缩写，中文意思是Windows硬件设备质量实验室，主要是对Windows操作系统的兼容性测试，检验硬件产品和驱动程序在windows系统下的兼容性和稳定性。当某一硬件或软件通过WHQL测试时，制造商可以在其产品包装和广告上使用“DesignedforWindows”标志。该标志可以证明硬件或软件已经
  • Flask框架入门：快速搭建轻量级Python网页应用 「已注销」 python-AIpython基础网站网络pythonflask后端
    转载：Flask框架入门：快速搭建轻量级Python网页应用1.Flask基础Flask是一个使用Python编写的轻量级Web应用框架。它的设计目标是让Web开发变得快速简单，同时保持应用的灵活性。Flask依赖于两个外部库：Werkzeug和Jinja2，Werkzeug作为WSGI工具包处理Web服务的底层细节，Jinja2作为模板引擎渲染模板。安装Flask非常简单，可以使用pip安装命令
  • 驱动程序为什么要做 WHQL 认证? GDCA SSL证书 网络协议网络
    驱动程序进行WHQL（WindowsHardwareQualityLabs）认证的核心价值在于解决兼容性、安全性和市场准入三大关键问题，具体必要性如下：️‌一、规避系统拦截，保障驱动可用性‌消除安装警告‌未认证的驱动在安装时会触发Windows的‌红色安全警告‌（如“无法验证发布者”），甚至被系统强制拦截。通过WHQL认证的驱动获得微软数字签名，用户可无阻安装‌。满足系统强制要求‌Windows1
  • 求是网：“内卷式”竞争的突出表现和主要危害有哪些？ 加百力 财经研究科技知识人工智能大数据
    "内卷式"竞争主要表现为：企业层面的低价竞争、同质化竞争和营销"逐底竞争"；地方政府层面的违规优惠政策、盲目重复建设和设置市场壁垒。危害体现在三个层面：微观上导致"劣币驱逐良币"，损害消费者利益；中观上破坏行业生态，挤压产业链利润空间；宏观上扭曲资源配置，抑制创新活力。什么是“内卷式”竞争？概括其一般特征，是指经济主体为了维持市场地位或争夺有限市场，不断投入大量精力和资源，却没有带来整体收益增长的
  • WHQL签名怎么申请 GDCA SSL证书 windows
    WHQL（WindowsHardwareQualityLabs）签名是微软对硬件和驱动程序进行认证的一种方式，以确保它们与Windows操作系统的兼容性和稳定性。以下是申请WHQL签名的基本步骤，供您参考：1.准备阶段准备硬件设备和驱动程序：确保您的硬件设备已经准备好，并且对应的驱动程序已经经过充分的测试，能够在各种配置和环境下正常工作。获取EV代码签名证书：根据微软的要求，驱动程序进行WHQL认
  • JSON 与 AJAX Auscy jsonajax前端
    一、JSON（JavaScriptObjectNotation）1.数据类型与语法细节支持的数据类型：基本类型：字符串（需用双引号）、数字、布尔值（true/false）、null。复杂类型：数组（[]）、对象（{}）。严格语法规范：键名必须用双引号包裹（如"name":"张三"）。数组元素用逗号分隔，最后一个元素后不能有多余逗号。数字不能以0开头（如012会被解析为12），不支持八进制/十六进制
  • 发票合并工具 小朋的软件园 前端javascriptjavahtml服务器
    "发票合并工具"是一款专为高效整理票据设计的实用工具，支持将来自不同渠道的发票文件（如PDF文档、各类图片格式）快速整合为排版规范的PDF文件，尤其适用于财务报销场景下的批量票据处理需求。核心功能亮点多格式兼容：无缝导入PDF文件及常见图片格式（.png/.jpg/.jpeg/.bmp），适配多来源发票整合需求。智能布局配置：提供灵活的页面布局选项（每页2/3/4张发票），其中"2合1"模式针对报
  • Python Flask 框架入门：快速搭建 Web 应用的秘诀 Python编程之道 Python人工智能与大数据Python编程之道pythonflask前端ai
    PythonFlask框架入门：快速搭建Web应用的秘诀关键词Flask、微框架、路由系统、Jinja2模板、请求处理、WSGI、Web开发摘要想快速用Python搭建一个灵活的Web应用？Flask作为“微框架”代表，凭借轻量、可扩展的特性，成为初学者和小型项目的首选。本文将从Flask的核心概念出发，结合生活化比喻、代码示例和实战案例，带你一步步掌握：如何用Flask搭建第一个Web应用？路由
  • C++ 11 Lambda表达式和min_element()与max_element()的使用_c++ lamda函数 min_element(
    网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化的资料的朋友，可以添加戳这里获取一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！intmain(){vectormyvec{3,
  • 上位机知识篇---SD卡&U盘镜像
    常用的镜像烧录软件balenaEtcherbalenaEtcher是一个开源的、跨平台的工具，用于将操作系统镜像文件（如ISO和IMG文件）烧录到SD卡和USB驱动器中。以下是其使用方法、使用场景和使用注意事项的介绍：使用方法下载安装：根据自己的操作系统，从官方网站下载对应的安装包。Windows系统下载.exe文件后双击安装；Linux系统若下载的是.deb文件，可在终端执行“sudodpkg-
  • 【LeetCode 热题 100】24. 两两交换链表中的节点——（解法一）迭代+哨兵 xumistore LeetCodeleetcode链表算法java
    Problem:24.两两交换链表中的节点题目：给你一个链表，两两交换其中相邻的节点，并返回交换后链表的头节点。你必须在不修改节点内部的值的情况下完成本题（即，只能进行节点交换）。文章目录整体思路完整代码时空复杂度时间复杂度：O(N)空间复杂度：O(1)整体思路这段代码旨在解决一个经典的链表操作问题：两两交换链表中的节点(SwapNodesinPairs)。问题要求将链表中每两个相邻的节点进行交换
  • Guava LoadingCache sqyaa. java并发编程Java知识jvm缓存guava
    LoadingCache是GoogleGuava库提供的一个高级缓存实现，它通过自动加载机制简化了缓存使用模式。核心特性自动加载机制当缓存未命中时，自动调用指定的CacheLoader加载数据线程安全：并发请求下，相同key只会加载一次灵活的过期策略支持基于写入时间(expireAfterWrite)和访问时间(expireAfterAccess)的过期可设置最大缓存大小，基于LRU策略淘汰丰富的
  • JavaScript 树形菜单总结 Auscy microsoft
    树形菜单是前端开发中常见的交互组件，用于展示具有层级关系的数据（如文件目录、分类列表、组织架构等）。以下从核心概念、实现方式、常见功能及优化方向等方面进行总结。一、核心概念层级结构：数据以父子嵌套形式存在，如{id:1,children:[{id:2}]}。节点：树形结构的基本单元，包含自身信息及子节点（若有）。展开/折叠：子节点的显示与隐藏切换，是树形菜单的核心交互。递归渲染：因数据层级不固定，
  • 基于定制开发开源AI智能名片S2B2C商城小程序的社群游戏定制策略研究 说私域 人工智能小程序游戏
    摘要：本文聚焦社群游戏定制领域，深入探讨以社群文化和用户偏好为导向的定制策略。通过分析互动游戏活动、社群文化塑造等关键要素，结合定制开发开源AI智能名片S2B2C商城小程序的技术特性，提出针对性游戏定制方案。研究旨在提升社群用户参与度与游戏体验，为社群游戏发展提供理论支持与实践指导。关键词：社群游戏定制；定制开发开源AI智能名片S2B2C商城小程序；社群文化；用户偏好一、引言在数字化社交蓬勃发展的
  • Leetcode 148. 排序链表
    文章目录前引题目代码（首刷看题解）代码（8.9二刷部分看解析）代码（9.15三刷部分看解析）前引综合性比较强的一道题，要求时间复杂度必须O(logn)才能通过，最适合链表的排序算法就是归并。这里采用自顶向下的方法步骤：找到链表中点（双指针）对两个子链表排序(递归，直到只有一个结点，记得将子链表最后指向nullptr）归并（引入dummy结点）题目Leetcode148.排序链表代码（首刷看题解）c
  • python_虚拟环境 阿_焦 python
    第一、配置虚拟环境：virtualenv（1）pipvirtualenv>安装虚拟环境包（2）pipinstallvirtualenvwrapper-win>安装虚拟环境依赖包（3）c盘创建虚拟目录>C:\virtualenv>配置环境变量【了解一下】：（1）如何使用virtualenv创建虚拟环境a、cd到C:\virtualenv目录下：b、mkvirtualenvname>创建虚拟环境nam
  • 全面触摸屏输入法设计与实现 长野君
    本文还有配套的精品资源，点击获取简介：触摸屏输入法是针对触摸设备优化的文字输入方案，包括虚拟键盘、手写、语音识别和手势等多种输入方式。本方案通过提供主程序文件、用户手册、界面截图、示例图、说明文本和音效文件，旨在为用户提供一个完整的、多样的文字输入体验。开发者通过持续优化算法和用户界面，使用户在无物理键盘环境下也能高效准确地进行文字输入。1.触摸屏输入法概述简介在现代信息技术飞速发展的今天，触摸屏
  • LeetCode 148. 排序链表：归并排序的细节解析 进击的小白菜 2025Top100详解leetcode链表算法
    文章目录题目描述一、方法思路：归并排序的核心步骤二、关键实现细节：快慢指针分割链表1.快慢指针的初始化问题2.为什么选择`fast=head.next`？示例1：链表长度为偶数（`1->2->3->4`）三、完整代码实现四、复杂度分析五、总结题目描述LeetCode148题要求对链表进行排序，时间复杂度需为O(nlogn)，且空间复杂度为O(logn)。由于链表的特殊结构（无法随机访问），归并排序
  • 前端项目架构设计要领
    1.架构设计的核心目标在设计前端项目架构时，核心目标是模块化、可维护、可扩展、可测试，以及开发效率的最大化。这些目标可以通过以下几个方面来实现：组件化：将UI功能封装为可复用的组件。模块化：将业务逻辑分解为独立的模块或服务。自动化构建与部署：实现自动化构建、测试和部署流程，减少人为操作的错误。代码规范化与检查：确保团队协作时，代码风格和质量一致。2.项目目录结构设计一个清晰合理的目录结构对大型项目
  • 精通Canvas：15款时钟特效代码实现指南 烟幕缭绕
    本文还有配套的精品资源，点击获取简介：HTML5的Canvas是一个用于绘制矢量图形的API，通过JavaScript实现动态效果。本项目集合了15种不同的时钟特效代码，帮助开发者通过学习绘制圆形、线条、时间更新、旋转、颜色样式设置及动画效果等概念，深化对Canvas的理解和应用。项目中的CSS文件负责时钟的样式设定，而JS文件则包含实现各种特效的逻辑，通过不同的函数或类处理时间更新和动画绘制，提
  • 高效批量单词翻译工具的设计与应用
    本文还有配套的精品资源，点击获取简介：在信息技术飞速发展的今天，批量单词翻译工具通过计算机的数据处理能力，大大提高了语言学习和文字处理的效率。用户通过简单输入单词列表到一个文本文件，并运行翻译程序，即可获得翻译结果并保存至指定文件。该工具集成了内置或外部翻译引擎，利用自然语言处理技术实现快速准确的翻译，并可能提供词性识别等附加功能。尽管机器翻译无法完全取代人工校对，但它为用户提供了一种高效的翻译解
  • 嵌入式系统LCD显示模块编程实践
    本文还有配套的精品资源，点击获取简介：本文档提供了一个具有800x480分辨率的3.5英寸液晶显示模块LW350AC9001的驱动程序代码，以及嵌入式系统中使用C/C++语言进行硬件编程的实践指南。该模块的2mm厚度使其适用于空间受限的便携式设备。内容包括驱动程序源代码、硬件控制接口使用方法，以及如何在嵌入式系统中进行图形处理、电源管理与性能优化。1.嵌入式系统原理1.1嵌入式系统概念嵌入式系统是
  • Android 开源组件和第三方库汇总 gyyzzr AndroidAndroid开源框架
    转载1、github排名https://github.com/trending,github搜索：https://github.com/search2、https://github.com/wasabeef/awesome-android-ui目录UIUI卫星菜单节选器下拉刷新模糊效果HUD与Toast进度条UI其它动画网络相关响应式编程地图数据库图像浏览及处理视频音频处理测试及调试动态更新热更新
  • FPGA小白到项目实战：Verilog+Vivado全流程通关指南（附光学类岗位技能映射） 阿牛的药铺 算法移植部署fpga开发verilog
    FPGA小白到项目实战：Verilog+Vivado全流程通关指南（附光学类岗位技能映射）引言：为什么这个FPGA入门路线能帮你快速上岗？本文设计了一条**"Verilog语法→工具链操作→光学项目实战→岗位技能对标"的阶梯式学习路径。不同于泛泛而谈的FPGA教程，我们聚焦光学类产品开发**核心能力（时序接口设计、图像处理算法移植、高速接口应用），通过3个递进式项目（从LED闪烁到图像边缘检测），
  • 22、文档：Google Docs的强大与易用性 pear55 探索云技术的无限可能GoogleDocs云端文档语音输入
    文档：GoogleDocs的强大与易用性1.GoogleDocs简介GoogleDocs是Google提供的在线办公套件的一部分，它是一个基于云端的文字处
  • Python流星雨 Want595 python开发语言
    文章目录系列文章写在前面技术需求完整代码代码分析1.模块导入2.画布设置3.画笔设置4.颜色列表5.流星类(Star)6.流星对象创建7.主循环8.流星运动逻辑9.视觉效果10.总结写在后面系列文章序号直达链接表白系列1Python制作一个无法拒绝的表白界面2Python满屏飘字表白代码3Python无限弹窗满屏表白代码4Python李峋同款可写字版跳动的爱心5Python流星雨代码6Python
  • Android ViewBinding 使用与封装教程 积跬步DEV Android开发实战大全android
    AndroidViewBinding使用与封装教程：一、ViewBinding是什么？核心功能：为每个XML布局文件自动生成一个绑定类（如ActivityMainBinding），直接暴露所有带ID的视图引用。优点：避免繁琐的findViewById()，类型安全且编译时检查。对比DataBinding：ViewBinding仅处理视图引用，无数据绑定功能。DataBinding支持双向数据绑定，
  • 理解TCP连接中的进程阻塞与CPU调度机制 109702008 编程#C语言网络tcp/ip网络人工智能
    引言在计算机网络通信中，TCP连接的建立是一个经典的三次握手过程。当用户调用connect()函数发起连接时，内核会发送SYN报文并等待对方的SYN-ACK响应。此时，调用进程通常会进入阻塞状态，暂停执行直至连接成功或超时。这一机制看似简单，但其背后的内核实现却涉及进程调度、等待队列管理和CPU资源分配等复杂操作。本文将深入探讨阻塞状态的实现原理，并解析CPU在进程阻塞期间的行为。一、进程阻塞的实
  • Java 并发包之线程池和原子计数 lijingyao8206 Java计数ThreadPool并发包java线程池
    对于大数据量关联的业务处理逻辑，比较直接的想法就是用JDK提供的并发包去解决多线程情况下的业务数据处理。线程池可以提供很好的管理线程的方式，并且可以提高线程利用率，并发包中的原子计数在多线程的情况下可以让我们避免去写一些同步代码。     这里就先把jdk并发包中的线程池处理器ThreadPoolExecutor 以原子计数类AomicInteger 和倒数计时锁C
  • java编程思想 抽象类和接口 百合不是茶 java抽象类接口
    接口c++对接口和内部类只有简介的支持,但在java中有队这些类的直接支持   1 ,抽象类 :  如果一个类包含一个或多个抽象方法,该类必须限定为抽象类(否者编译器报错)   抽象方法 : 在方法中仅有声明而没有方法体    package com.wj.Interface;
  • [房地产与大数据]房地产数据挖掘系统 comsci 数据挖掘
           随着一个关键核心技术的突破,我们已经是独立自主的开发某些先进模块,但是要完全实现,还需要一定的时间...        所以,除了代码工作以外,我们还需要关心一下非技术领域的事件..比如说房地产     &nb
  • 数组队列总结 沐刃青蛟 数组队列
          数组队列是一种大小可以改变，类型没有定死的类似数组的工具。不过与数组相比，它更具有灵活性。因为它不但不用担心越界问题，而且因为泛型（类似c++中模板的东西）的存在而支持各种类型。      以下是数组队列的功能实现代码：   import List.Student; public class
  • Oracle存储过程无法编译的解决方法 IT独行者 oracle存储过程　
    今天同事修改Oracle存储过程又导致2个过程无法被编译，流程规范上的东西，Dave 这里不多说，看看怎么解决问题。   1.     查看无效对象 XEZF@xezf(qs-xezf-db1)> select object_name,object_type,status from all_objects where status='IN
  • 重装系统之后oracle恢复 文强chu oracle
    前几天正在使用电脑，没有暂停oracle的各种服务。 突然win8.1系统奔溃，无法修复，开机时系统 提示正在搜集错误信息，然后再开机，再提示的无限循环中。 无耐我拿出系统u盘 准备重装系统，没想到竟然无法从u盘引导成功。 晚上到外面早了一家修电脑店，让人家给装了个系统，并且那哥们在我没反应过来的时候， 直接把我的c盘给格式化了 并且清理了注册表，再装系统。 然后的结果就是我的oracl
  • python学习二（ 一些基础语法） 小桔子 pthon基础语法
    紧接着把！昨天没看继续看django 官方教程，学了下python的基本语法 与c类语言还是有些小差别： 1.ptyhon的源文件以UTF-8编码格式 2. /   除 结果浮点型 //  除 结果整形 %   除 取余数 *   乘 **  乘方 eg 5**2 结果是5的2次方25 _&
  • svn 常用命令 aichenglong SVN版本回退
    1 svn回退版本   1)在window中选择log,根据想要回退的内容,选择revert this version或revert chanages from this version 两者的区别:   revert this version:表示回退到当前版本(该版本后的版本全部作废)   revert chanages from this versio
  • 某小公司面试归来 alafqq 面试
    先填单子，还要写笔试题，我以时间为急，拒绝了它。。时间宝贵。 老拿这些对付毕业生的东东来吓唬我。。 面试官很刁难，问了几个问题，记录下； 1，包的范围。。。public,private,protect. --悲剧了 2，hashcode方法和equals方法的区别。谁覆盖谁.结果，他说我说反了。 3，最恶心的一道题，抽象类继承抽象类吗？（察，一般它都是被继承的啊） 4，stru
  • 动态数组的存储速度比较 集合框架 百合不是茶 集合框架
    集合框架： 自定义数据结构(增删改查等) package 数组; /** * 创建动态数组 * @author 百合 * */ public class ArrayDemo{ //定义一个数组来存放数据 String[] src = new String[0]; /** * 增加元素加入容器 * @param s要加入容器
  • 用JS实现一个JS对象，对象里有两个属性一个方法 bijian1013 js对象
    <html> <head> </head> <body> 用js代码实现一个js对象，对象里有两个属性，一个方法 </body> <script> var obj={a:'1234567',b:'bbbbbbbbbb',c:function(x){
  • 探索JUnit4扩展：使用Rule bijian1013 java单元测试JUnitRule
            在上一篇文章中，讨论了使用Runner扩展JUnit4的方式，即直接修改Test Runner的实现(BlockJUnit4ClassRunner)。但这种方法显然不便于灵活地添加或删除扩展功能。下面将使用JUnit4.7才开始引入的扩展方式——Rule来实现相同的扩展功能。 1. Rule       &n
  • [Gson一]非泛型POJO对象的反序列化 bit1129 POJO
    当要将JSON数据串反序列化自身为非泛型的POJO时，使用Gson.fromJson(String, Class)方法。自身为非泛型的POJO的包括两种： 1. POJO对象不包含任何泛型的字段 2. POJO对象包含泛型字段，例如泛型集合或者泛型类 Data类 a.不是泛型类， b.Data中的集合List和Map都是泛型的 c.Data中不包含其它的POJO    
  • 【Kakfa五】Kafka Producer和Consumer基本使用 bit1129 kafka
    0.Kafka服务器的配置 一个Broker， 一个Topic Topic中只有一个Partition（）   1. Producer： package kafka.examples.producers; import kafka.producer.KeyedMessage; import kafka.javaapi.producer.Producer; impor
  • lsyncd实时同步搭建指南——取代rsync+inotify ronin47
    1. 几大实时同步工具比较 1.1 inotify + rsync 最近一直在寻求生产服务服务器上的同步替代方案，原先使用的是 inotify + rsync，但随着文件数量的增大到100W+，目录下的文件列表就达20M，在网络状况不佳或者限速的情况下，变更的文件可能10来个才几M，却因此要发送的文件列表就达20M，严重减低的带宽的使用效率以及同步效率；更为要紧的是，加入inotify
  • java-9. 判断整数序列是不是二元查找树的后序遍历结果 bylijinnan java
    public class IsBinTreePostTraverse{ static boolean isBSTPostOrder(int[] a){ if(a==null){ return false; } /*1.只有一个结点时，肯定是查找树 *2.只有两个结点时，肯定是查找树。例如{5,6}对应的BST是 6 {6,5}对应的BST是
  • MySQL的sum函数返回的类型 bylijinnan javaspringsqlmysqljdbc
    今天项目切换数据库时，出错 访问数据库的代码大概是这样： String sql = "select sum(number) as sumNumberOfOneDay from tableName"; List<Map> rows = getJdbcTemplate().queryForList(sql); for (Map row : rows
  • java设计模式之单例模式 chicony java设计模式
    在阎宏博士的《JAVA与模式》一书中开头是这样描述单例模式的： 　　作为对象的创建模式，单例模式确保某一个类只有一个实例，而且自行实例化并向整个系统提供这个实例。这个类称为单例类。 单例模式的结构 　　单例模式的特点： 单例类只能有一个实例。 单例类必须自己创建自己的唯一实例。 单例类必须给所有其他对象提供这一实例。 　　饿汉式单例类   publ
  • javascript取当月最后一天 ctrain JavaScript
    <!--javascript取当月最后一天--> <script language=javascript> var current = new Date(); var year = current.getYear(); var month = current.getMonth(); showMonthLastDay(year, mont
  • linux tune2fs命令详解 daizj linuxtune2fs查看系统文件块信息
    一.简介： tune2fs是调整和查看ext2/ext3文件系统的文件系统参数，Windows下面如果出现意外断电死机情况，下次开机一般都会出现系统自检。Linux系统下面也有文件系统自检，而且是可以通过tune2fs命令，自行定义自检周期及方式。 二.用法： Usage: tune2fs [-c max_mounts_count] [-e errors_behavior] [-g grou
  • 做有中国特色的程序员 dcj3sjt126com 程序员
      从出版业说起 网络作品排到靠前的，都不会太难看，一般人不爱看某部作品也是因为不喜欢这个类型，而此人也不会全不喜欢这些网络作品。究其原因，是因为网络作品都是让人先白看的，看的好了才出了头。而纸质作品就不一定了，排行榜靠前的，有好作品，也有垃圾。 许多大牛都是写了博客，后来出了书。这些书也都不次，可能有人让为不好，是因为技术书不像小说，小说在读故事，技术书是在学知识或温习知识，有
  • Android：TextView属性大全 dcj3sjt126com textview
    android:autoLink    设置是否当文本为URL链接/email/电话号码/map时，文本显示为可点击的链接。可选值(none/web/email/phone/map/all)  android:autoText    如果设置，将自动执行输入值的拼写纠正。此处无效果，在显示输入法并输
  • tomcat虚拟目录安装及其配置 eksliang tomcat配置说明tomca部署web应用tomcat虚拟目录安装
    转载请出自出处：http://eksliang.iteye.com/blog/2097184 1.-------------------------------------------tomcat  目录结构 config：存放tomcat的配置文件 temp  ：存放tomcat跑起来后存放临时文件用的 work   ： 当第一次访问应用中的jsp
  • 浅谈：APP有哪些常被黑客利用的安全漏洞 gg163 APP
    首先，说到APP的安全漏洞，身为程序猿的大家应该不陌生；如果抛开安卓自身开源的问题的话，其主要产生的原因就是开发过程中疏忽或者代码不严谨引起的。但这些责任也不能怪在程序猿头上，有时会因为BOSS时间催得紧等很多可观原因。由国内移动应用安全检测团队爱内测（ineice.com）的CTO给我们浅谈关于Android 系统的开源设计以及生态环境。 1. 应用反编译漏洞：APK 包非常容易被反编译成可读
  • C#根据网址生成静态页面 hvt Web.netC#asp.nethovertree
    HoverTree开源项目中HoverTreeWeb.HVTPanel的Index.aspx文件是后台管理的首页。包含生成留言板首页，以及显示用户名，退出等功能。根据网址生成页面的方法：   bool CreateHtmlFile(string url, string path) { //http://keleyi.com/a/bjae/3d10wfax.htm stri
  • SVG 教程 （一） 天梯梦 svg
    SVG 简介 SVG 是使用 XML 来描述二维图形和绘图程序的语言。 学习之前应具备的基础知识： 继续学习之前，你应该对以下内容有基本的了解： HTML XML 基础 如果希望首先学习这些内容，请在本站的首页选择相应的教程。 什么是SVG？ SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用来定义用于网络的基于矢量
  • 一个简单的java栈 luyulong java数据结构栈
    public class MyStack { private long[] arr; private int top; public MyStack() { arr = new long[10]; top = -1; } public MyStack(int maxsize) { arr = new long[maxsize]; top
  • 基础数据结构和算法八：Binary search sunwinner AlgorithmBinary search
    Binary search needs an ordered array so that it can use array indexing to dramatically reduce the number of compares required for each search, using the classic and venerable binary search algori
  • 12个C语言面试题，涉及指针、进程、运算、结构体、函数、内存，看看你能做出几个！ 刘星宇 c面试
    12个C语言面试题，涉及指针、进程、运算、结构体、函数、内存，看看你能做出几个！ 1.gets()函数 问：请找出下面代码里的问题： #include<stdio.h> int main(void) {     char buff[10];     memset(buff,0,sizeof(buff));
  • ITeye 7月技术图书有奖试读获奖名单公布 ITeye管理员 活动ITeye试读
    ITeye携手人民邮电出版社图灵教育共同举办的7月技术图书有奖试读活动已圆满结束，非常感谢广大用户对本次活动的关注与参与。 7月试读活动回顾： http://webmaster.iteye.com/blog/2092746 本次技术图书试读活动的优秀奖获奖名单及相应作品如下（优秀文章有很多，但名额有限，没获奖并不代表不优秀）： 《Java性能优化权威指南》
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他