01|字母x CSS世界中隐匿的举足轻重的角色
因为涉及到排班或者说对齐的,其实都是离不开一个基本的概念:baseline(基线 )
line-height行高的定义就是两基线的间距,vertical-align的默认值也是基线(字母x的下边缘 )!
01|字母X与CSS中的x-height
其中x-height是CSS中的一个概念,表示小写字母x的高度,其术语的意思表示为 baseline和midline之间的距离!
其中在所谓的排版中还有另外一些概念,如下所示:
ascender height 上行线高度
cap height 大写字母高度
median 中线
descender 下行线高度
其中CSS中有些概念和这个所谓的x-height还是有关系的! 典型的代表就是 vertical-align:middle;
middle表示中间的意思,其实和上面介绍的median是没有关系的, middle表示的是 基线往上1/2 x-height的高度
我们的话可以立即为x交叉点的位置!
但是微软雅黑相较于别的字体来看是字符下沉比较厉害的字体,一年春vertical-align:middle; 不是相对容器中分线对齐的了!
其实这又说到了 因为CSS世界中的主题是文字,内容元素对齐是相对于文字对齐的,而并非外部的块级容器!
02|字母x与CSS中的ex
ex其实就是IE6都老早支持的ex单位,其实也是一个CSS中的一个相对单位,指的就是小写x的高度! 也就是所谓的 x-height!
其实所谓的em,px还是受字体等CSS属性影响较大! 由于字母x受字体影响比较大,不稳定,因此ex也不适合来限定元素的尺寸!
但是他的应用场景体现在 不受字体和字号影响的内联元素垂直居中对齐!
我们设置垂直居中的时候 就可以借助这个ex来进行垂直居中!
预览请见:https://demo.cssworld.cn/5/1-1.php
因为不管字体怎么变换 内联元素都是按照文字基线对齐的,
02|内联元素的基石line-height
div高度是由行高决定的并非文字,通过p114中的案例就可以很好地说明了!
并对于纯非替换元素的内联元素,可视高度完全有line-height决定!
那么如果说替换元素或者说是块级元素那么对应的line-height其中有扮演着什么角色呢?
其中就需要很好的理解所谓的 行距和半行距 的概念了!
当前文字的上方和下方的间距都是半间距! 半间距仅仅是行距高度的一半!
其实所谓的 行距=行高-字体盒子 || 行距=(line-height )-(font-size )
01|为什么line-height可以让内联元素"垂直居中 "
我们一般流传着 高度和行高一致 可以让单行文字垂直居中 !
其实这种说法不严谨,误区二,其实行高控制不仅仅适用于单行,其实多行也是可以的!
详情见p119
那么为什么说垂直居中说法不严谨呢? 其实详细通过测量会发现 还是会发现细微差别的! 其实和line-height无关,而是与vertical-align相关的!
02|line-height的好朋友vertical-align
为什么说line-height的好朋友是vertical-align呢? 因为凡事line-height起作用的地方vertical-align也一定的起了作用,但是大部分默默地起了作用 只是我们不知道而已!
其实可以通过一个小的案例体现出来:
文字
通过这段代码,看看具体的行高为多少?
可能有些人看到了会认为是32px,其实没有设定height属性,所以高度就有line-height来确定,因此这里明摆着的高度就是为32px,其实事实却不是如此,其实实际上要比32px要大上几像素!(和对应的字体相关 )
实际的效果通过鼠标选中 发现对应的高度不为line-height的高度32px!
其实所谓的box的高度不等于line-height,之所以对应的行高不等于对应的32px就是因为line-height的"朋友 "搞的鬼!
03|vertical-align家族基本认识
抛开对应的inherit这类全局属性不谈的话,可以将对应的vertical-align的属性值分为4类:
线类: baseline top middle bottom
文本类: text-top text-bottom
上标下标类: sub,super
数值百分比类: 20px 2em 20%
其实所谓的数值百分比 其实应该分为 数值类 和对应的 百分比类 因为他们之间有不同的共性
具有相同的渲染规则 根据计算值的不同 相对于基线往上或者是往下偏移!
并且默认的对齐方式 是按照基线对齐,因此如果如果说对应的vertical-align的值为正数的话 那么则向上偏移 如果为负数的话 则向下偏移 也就可以验证对应的baseline其实是对应着vertical-align的默认值为0!
对应的vertical-align:middle也不是百分之百的垂直居中的,其实还是有些差别的 并且对应的差别也是由于这个字体和字号所决定的!
并且在CSS世界中,凡是百分比的值均是需要一个相对计算的值的,比如说margin和padding的话 是相对于宽度计算的,line-height是相对于font-size计算的,而这里的vertical-align属性的百分比值则是相对于line-height的计算值计算的!
01|vertical align作用的前提
其实vertical align作用的前提就是:只能够应用于内联元素以及display值为table-cell的元素!
也就是说了 只能作用于 inline,inline-block,inline-table或者说table-cell的元素上面!
当然有些属性设置会改变元素的display的值的! 就比如说 浮动或者说绝对定位 会导致元素变成块级元素!
有人说table-cell会无视行高,其实并不是这样的,而是对应的vertical-align起作用的是table-cell元素自身!
02|vertical-align和line-height之间的关系
其实vertical-align和line-height之间的关系比较明确,就是"朋友关系",因为最明显的就是vertical-align计算的,但是表面所见的这点关系实际上只是冰山一角!
之前介绍到的设定了行高和对应的字号大小,之后的话呢,高度是否等于对应的行高,最后的结果却不是我们所设定的行高!
其主要原因是因为字号的印象,因为文字全部是按照基线对齐,因此当两个字号不同的蚊子在一起的时候,彼此会发生上下位移,如果位移距离足够大的话,就会超过行高的限制!
其实间隙产生的三大元凶便是:
幽灵空白节点
line-height
vertical-align
为了更好地理解,我们将在幽灵节点的位置放置字母x替代 幽灵空白节点!
如何更好地解决这个问题:
图片块状化
容器的line-height足够小
容器的font-size足够小
图片设置vertical-align属性值!
03|深入理解vertical-align线性类属性值
inline-block与baseline,vertical-align的属性的默认值baseline在文本之类的内联元素那里就是字符x的下边缘,对于替换元素则是替换元素的下边缘但是如果说是inlineblock元素的话规则则要复杂一些了:
一个inline-block元素如果说里面没有内联元素的话,或者overflow不是visible则该元素的基线就是其margin底边缘;否则其基线里面最后一行内联元素的基线!
这里的话,分享一下总结的一套基于20px图标对齐的处理技巧,该技巧有以下3个要点:
图标高度和当前行高都为20px 将图标原先拓展成统一规格! 可以节约大量CSS以及对每一个图标对其进行不同处理的开发版本
图标标签里面永远有字符 这个可以借助对应的:before和:after伪元素生成一个空格字符串轻松搞定!
图标CSS不使用overflow:hidden保证肌纤维里面字符的基线,但是要让里面潜在的字符不可见!
04|了解vertical-align:top/bottom
基本表现类似,只是一个"上"一个"下"因此和在一起讲
定义具体如下:
元素底部或者说当前行框盒子的顶部对齐
table-cell 元素底部padding边缘和表格行的顶部对齐
如果是内联元素,则和这一行高度最高的内联元素的顶部对齐
如果说display计算值是table-cell的元素的话,我们不妨脑补成"
" 元素 则和' '元素上边缘对齐!
其实bottom的话,和top正好相反!
并且需要注意的是,内联元素的上下边缘对齐的这个"边缘 "是当前"行框盒子 "的上下边缘,并不是块状容器的上下边缘!
其实在该属性中的top和bottom值可以说是最容易理解的了vertical-align属性值了,并且对应的表现也相当的稳定! 不会出现难以理解的现象! 常常在实际开发的过程中用到!
05|vertical-align:middle与近似垂直居中
其实在我们日常开发中的line-height和对应的vertical-align所实现的垂直居中,其实都是"近似垂直居中 "! 原因与vertical-align:middle的定义相关!
内联元素:元素的垂直中心点和行框盒子基线往上1/2 x-height处对齐
table-cell元素:单元格填充盒子相对于外面的表格行居中对齐!
基本上所有的字体当中,字符x的位置都是偏下一点儿的,并且是字号越大偏移越明显!
因此导致的vertical-align:middle实现的都是"近似垂直居中! "
其实如果说要实现真正意义上的垂直居中的话,那么需要将X的位置在容器垂直方向的正中间即可!
通常的做法是通过font-size:0;
根据line-height的半行间距上下等分原则,其实这个点就在整个容器的垂直中心位置!
但是我们在日常开发的过程中会发现,font-size的值可能在12px和在14px之间的! 虽然说效果是 "近似垂直居中 "但是还是比较难察觉出其中细微的差距的! 因此是否需要实现真正意义上的垂直居中,还需要不断的权衡!
06|深入理解vertical-align文本类属性值
其实文本类属性值就是text-top和text-bottom,其中具体的定义如下:
简单介绍所谓的内容区域:FireFox/IE浏览器文本选中的背景区域,默认状态下的內联文本的背景色区域!
对应的"父级内容区域 "其实也就是父级元素当前font-size和font-family下应有的内容区域 的大小!
定义可以理解为假设元素后面有一个和父元素font-size,font-family一模一样的文字内容,则vertical-align:text-top;标识元素和这个文字的内容区域的上边缘对齐!
其实讲到这里可以通过预览发现其中的表现在哪里?
预览请见:https://demo.cssworld.cn/5/3-9.php
看到了对应的区别之后呢,来讲讲以下几个明显的优势:
文本类属性值的垂直对齐与左右文字大小和高度都没有关系,线性类属性的定位都会受到兄弟内联元素的影响!
文本类属性值的垂直对齐可以像素级精确控制,如果是线性雷属性值中的基线和对应的line-height都是无法精确控制垂直居中对齐的! 图文对齐可以控制父元素的font-size 如果是文字对齐可以改变文字的line-height 精确控制对其位置!
其实也从侧面说明了问题,就是CSS设计之初的初衷可能非常的简单,但是结果呢可能却满天飞! 有些属性值应该有大成,实际却无人问津 ! (vertical-align中的文本类属性的属性值就是之一! )
其中主要的原因如下:
使用场景缺乏 当前的CSS重构主要以"精致布局 "为主,对齐文本的场景相比旧时代要少很多!
文本类垂直对齐理解成本高 一般人可能会用margin定位或者说relative,资深一点可能会用vertical-align数值的方式进行调整,但是呢对应的文本类属性值却很少用,"难以理解 " 不方便!
内容区域不直观并且内容区域的"易变" 现在实际上对外的项目都要求 精确布局并且像素级还原, 但是内容区域本身默认是看不见的, 并且 内容区域大小是默认和字体font-family相关的,如果说在不同的平台上面运行的话,现实是不同的,内容区域的不同会导致布局对齐的位置也不同,产生了对应的“不兼容 ”,如果说对视觉要求较高的话,该问题就比较严重了!
这样一来 文本类属性在理论上面强大,但是如果说应用到实际层面开发中的话使用价值却非常有限!
07|简单了解vertical-align上标下标类属性值
在vertical-align下标类属性值指的就是sub和super两个值!对应的就是下上标!
在HTML中有
和
两种标签,语义上其实和我们的sub和super其实是一致的!也是上下标的关系!
其实他们两对不一般啊,sup标签默认的vertical-align属性值是vertical-align就是super,sub对应的也就是sub!
ProbeDream123 //其实就是 ProbeDream123 其中的123在ProbeDream右上角!
ProbeDream456 //其实也就是ProbeDream456 其中的456在ProbeDream左下角!
基本上所谓的vertical-align上下标属性值的实际应用价值也就只有这么点了! 通过下面的定义就知道了:
vertical-align:super; 提高盒子的基线到父级合适的上标基线位置!
vertical-align:sub; 提高盒子的基线到父级合适的下标基线位置!
其中在定义中的合适的意思就显得有点模棱两可了,就非常让人蛮茫然!与此同时,我们还要注意,vertical-align上下标属性值并不会改变对应元素的文字大小 ,更不要被 sub和sup标签给误导了! 因为这两个HTML标签的默认的font-size为smaller!
算是对之前内容的一个必要的总结,对于内联元素,有一个"幽灵空白节点 "和"无处不在的vertical-align属性 "
虽然说同属性线性雷属性值,但是top/bottom和baseline/middle却是完全不同的两个帮派,前者是看边缘和看盒子,但是后者是和字符x打交道!
并且与此同时还需要了解内联盒模型,不同属性值定义完全不同,且很多属性table-cell元素有着不同的定义,同时最终表现与字符x,line-height,font-size,font-family属性密切相关! 需要对这些属性有比较深入的了解!
在本文中示例的展示都是单属性值和默认值baseline如何作用的,但是实际开发的时候会经常出现两个内联元素同时设置baseline意外属性值的情况,但是实际上 , vertical-align个类属性值并不会存在互相冲突的情况!但是某个vertical-align的属性值确实会影响某个元素的表现,但是并不是直接的,因此我们在分析复杂场景的时候,仅需要套用定义分析当前的vertical-align值的作用就行了!
基于vertical-align属性的水平垂直居中的弹框!
预览请见:https://demo.cssworld.cn/5/3-10.php
其中相较于传统的JavaScript精确计算弹框的位置,有以下优点:
1.节省了很多无谓的JavaScript代码,并且不需要浏览器进行热size事件之类的处理,弹框内容动态变化的时候,无需重新定位!
2.性能更快,喧嚷速度更快,浏览器内置CSS的即时渲染器比JavaScript处理的更好!
3.可以非常灵活控制垂直居中的比例
4.容器设置了overflow:auto可以实现弹框高度超过一屏是依然能够看见屏幕外的内容,传统实现方法则比较尴尬!
你可能感兴趣的:(05|内联元素与流)
【HarmonyOS之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(三)
枫叶丹4
HarmonyOS 前端 javascript 开发语言 华为 harmonyos
目录1->生命周期1.1->应用生命周期1.2->页面生命周期2->资源限定与访问2.1->资源限定词2.2->资源限定词的命名要求2.3->限定词与设备状态的匹配规则2.4->引用JS模块内resources资源3->多语言支持3.1->定义资源文件3.2->引用资源1->生命周期1.1->应用生命周期在app.js中可以定义如下应用生命周期函数:属性类型描述触发时机onCreate()=>vo
docker compose 部署 nacos
自在1990
linux运维之拿来就用 docker 容器 运维 阿里云
简介Nacos(NamingandConfigurationService)是一个开源的动态服务发现、配置管理和服务管理平台,旨在帮助微服务架构中的服务治理。它由阿里巴巴开发,广泛应用于云原生应用和微服务环境中。核心特性服务发现:支持服务的注册与发现,允许服务实例动态注册到Nacos,其他服务可以通过Nacos查询相应的服务实例。配置管理:提供集中式的配置管理,可以动态管理和推送配置文件,支持多种
docker desktop compose文件
叫我八吧
docker 容器 运维
我整理的一些关于【Docker】的项目学习资料(附讲解~~)和大家一起分享、学习一下:https://d.51cto.com/f2PFnNDockerDesktop与Compose文件使用指南Docker是现代应用程序开发和部署的重要工具。它能够将应用及其所有依赖打包到一个轻量级的、可移植的容器中。DockerDesktop是Docker的图形界面客户端,提供了一个简化的用户体验,使得你可以更方便
linux asio网络编程理论及实现
辣椒卷二王
网络 boost/asio 网络编程 并发编程
最近在B站看了恋恋风辰大佬的asio网络编程,质量非常高。在本章中将对ASIO异步网络编程的整体及一些实现细节进行完整的梳理,用于复习与分享。大佬的博客:恋恋风辰官方博客Preactor/Reactor模式在网络编程中,通常根据事件处理的触发时机和处理逻辑的分工可以分为reactor模式和preactor模式。reator是非阻塞同步网络模式,preactor是异步网络模式。阻塞I/O我们知道re
Docker Desktop 解决从开发到部署的高效容器化工作流问题
由数入道
容器编排 docker 容器 运维
一、基本概念DockerDocker是一个开源的容器化平台,提供了一种轻量级的方式来打包、运行和管理应用程序及其依赖项。通过Docker,你可以:容器化应用程序:将代码、依赖项和配置打包成一个独立的容器镜像。便携性:一次构建,随处运行,无论是开发环境、测试环境还是生产环境。高效资源利用:容器共享操作系统内核,比虚拟机更轻量。Kubernetes(K8s)Kubernetes是一个用于自动化容器部署
今日头条公域流量引流新径:开源 AI 智能名片 2 + 1 链动模式 S2B2C 商城小程序融合之道
说私域
人工智能 小程序
摘要:本文深度聚焦于今日头条平台庞大且持续增长的公域流量,全面探讨在平台严控流量外流背景下,如何行之有效地利用该平台进行私域流量引流,特别是将微信号作为私域承接载体的具体策略。同时,创新性地引入开源AI智能名片2+1链动模式S2B2C商城小程序,深入分析其与今日头条引流策略相结合的优势及潜在价值,旨在为企业和营销者提供全面且具创新性的流量运营思路,助力其在复杂多变的互联网环境中实现高效的私域流量转
单细胞-第五节 多样本数据分析,打分R包AUCell
遗落凡尘的萤火-生信小白
单细胞分析 数据分析 r语言 windows
文件在单细胞\5_GC_py\1_single_cell\3.AUCell.Rmd1.基因rm(list=ls())load("g.Rdata")2.AUCellhttps://www.ncbi.nlm.nih.gov/pmc/articles/PMC9897923IF:NANANA用这个文章里的方法,将单细胞亚群的marker基因与ros相关基因取交集,用作AUCell的基因集Theinters
bulk-seq数据和单细胞数据的联合分析
追风少年ii
python 算法 人工智能
作者,EvilGenius随着现在研究的不断深入,越来越多的情况需要我们对多种数据的联合分析,其中在单细胞没有出来之前,普通转录组(bulk-seq)的测序结果是非常多的,也解决了我们很多的生物学问题,单细胞技术的出现,更高分辨率的同时,与普通转录组的联合分析也是现在分析的一个关注点。在文章《Distinctandtemporary-restrictedepigeneticmechanismsre
Linux 上 MySQL 8.0 的备份与恢复实战指南
云水一方
mysql linux 大数据 数据仓库 运维 数据库
在数据库运维过程中,备份与恢复是保障数据安全的重要手段。MySQL8.0在Linux环境中提供了多种备份和恢复方案,包括逻辑备份和物理备份。本文将介绍这些备份方式的操作步骤与逻辑实现,帮助您高效管理数据库。一、备份与恢复的作用和意义数据安全:防止因误操作、硬件故障或恶意攻击导致的数据丢失。容灾恢复:在灾难发生后快速恢复业务功能,减少停机时间。数据迁移:支持数据库迁移至新环境或硬件。二、备份方式概览
windows进阶-cmd命令
云水一方
运维 windows c语言
在Windows操作系统中,CMD提供了许多强大的命令,能够帮助用户执行一些更为高级的任务。这些命令不仅仅限于文件和目录的管理,还包括了服务管理、远程连接、注册表操作等功能。本文将介绍一些常见但较为特殊的CMD命令及其功能,帮助你更好地使用Windows命令行。1.sc–服务管理sc命令用于与Windows服务交互,可以启动、停止、配置或查询系统服务。这是一个功能强大的工具,尤其在进行系统管理时非
java 字节文件类型_Java根据字节数据判断文件类型
weixin_39795284
java 字节文件类型
通常,在WEB系统中,上传文件时都需要做文件的类型校验,大致有如下几种方法:1.通过后缀名,如exe,jpg,bmp,rar,zip等等。2.通过读取文件,获取文件的Content-type来判断。3.通过读取文件流,根据文件流中特定的一些字节标识来区分不同类型的文件。4.若是图片,则通过缩放来判断,可以缩放的为图片,不可以的则不是。然而,在安全性较高的业务场景中,1,2两种方法的校验会被轻易绕过
大数据组件ClickHouse介绍(场景、优劣势、性能)
坚持是一种态度
大数据开发 ClickHouse 大数据 clickhouse 数据库 列式数据库
大数据组件ClickHouse介绍简介使用场景优势与劣势优势劣势性能单个查询吞吐量处理短查询的延时时间处理大量短查询数据写入性能查询性能简介clickhouse是一个高性能的列式存储分析数据库管理系统,由俄罗斯搜索引擎公司yandex开发。clickhouse具有以下特点高性能:clickhouse优化了查询和数据压缩算法,支持多维度数据分析和快速聚合查询。分布式:clickhouse采用共享无状
python round函数用法
ncst
Python python
round()方法返回x的小数点四舍五入到n个数字。语法以下是round()方法的语法:round(x[,n])参数x–这是一个数值表达式n–这也是一个数值表达式返回值该方法返回x的小数点四舍五入到n个数字例子下面的例子显示了round()方法的使用print“round(80.23456,2):“,round(80.23456,2)print“round(100.000056,3):“,roun
DB2-Db2Connection
DataLu
DB2-debezium 数据库 大数据 数据库开发 开源
提示:Db2Connection主要负责与DB2数据库的交互,特别针对CDC功能,提供了获取和处理数据库更改日志的能力,同时包含数据库连接管理、查询执行和结果处理的通用功能文章目录前言一、核心功能二、代码分析总结前言提示:Db2Connection类旨在简化与Db2数据库的交互,提供了一套全面的数据库操作接口,特别是针对需要利用Db2的变更数据捕获能力的场景。通过这个类,开发者可以更方便地执行数据
深入探索数据库世界:SQLite、Redis、MySQL 与数据库设计范式
巴依老爷coder
数据库 数据库 sqlite redis 网络安全 mysql sql database
数据库深入探索数据库世界:SQLite、Redis、MySQL与数据库设计范式一、SQLite数据库全方位解析(一)创建与基本操作(二)数据存储与表结构设计(三)数据操作:增删改查(四)与C语言联合使用(五)防止SQL注入二、Redis数据库深度剖析(一)数据存储类型与独特结构(二)数据持久化策略(三)卓越性能表现与应用场景三、MySQL数据库概览(一)创建数据库与表(二)数据操作与C语言交互四、
Redis 与 SQLite 的完美结合:深入探究 Redka 项目
youyouiknow
tech-review redis sqlite 后端 架构 数据库 缓存
随着数据存储和访问需求的不断增长,不同类型的数据库在各自的领域中发挥着重要的作用。Redis以其高性能的内存数据库特性,广泛应用于需要快速响应的场景;SQLite则以其轻量级的嵌入式关系数据库,被广泛应用于移动设备和小型应用中。那么,如果将两者的优点结合起来,会产生怎样的火花呢?Redka就是这样一个旨在利用SQLite重新实现Redis优秀部分的项目,同时保持与RedisAPI的兼容性。一、Re
重新架构:从 Redis 到 SQLite 性能提升
极道Jdon
javascript reactjs
在这篇博文中,他们用SQLite取代了Redis,而令人惊讶的是,SQLite的速度更快!有趣的是,Redis是在本地运行,而SQLite是将数据存储在磁盘上。因此,这是内存(Redis)与磁盘(SQLite)的较量,但Redis需要通过IPC进行通信。人们一直以为磁盘I/O比IPC慢,但显然这并不总是正确的!实际上,IPC也可能更慢!Redis自己也承认这点Wafris重新架构了它的系统,从Re
男孩取名分享:光彩夺目、聪明机灵的男孩名
古德起名轩
男孩取名分享:光彩夺目、聪明机灵的男孩名名字不仅是代表一个人的符号与称谓,里面更包含着父母的爱与希望。随着人际交往越来越频繁,作为社交首要“名片”的名字就显得十分重要了。一个美好如意的好名字,可以给人带来欢喜,带来信心,带来好运,带来美好幸福,因此可见,拥有一个好名字是非常重要的。下面知一起名专家为大家推荐聪明机灵的男孩名,仅供家长参考。精选聪明机灵的男孩名一、钟赫(zhōnghè)字义内涵:钟:
再写最长上升子序列(简单dp)
计信金边罗
算法 c++ 数据结构
给定一个长度为的数列,求数值严格单调递增的子序列的长度最长是多少。输入格式第一行包含整数。第二行包含个整数,表示完整序列。输出格式输出一个整数,表示最大长度。数据范围1≤≤1000,−109≤数列中的数≤109输入样例:73121856输出样例:4难度:简单时/空限制:1s/64MB总通过数:100525总尝试数:154358来源:模板题AcWing算法标签#includeusingnamespa
回文数(进阶版)
计信金边罗
算法
若一个数(首位不为零)从左向右读与从右向左读都是一样,我们就将其称之为回文数。例如:给定一个10进制数56,将56加65(即把56从右向左读),得到121是一个回文数。又如,对于10进制数87,STEPl:87+78=165STEP2:165+561=726STEP3:726+627=1353STEP4:1353+3531=4884 在这里的一步是指进行了一次N进制的加法,上例最少用了4步得到回
SpringBoot在Kubernetes上部署及其扩展实践
AI天才研究院
Python实战 自然语言处理 人工智能 语言模型 编程实践 开发语言 架构设计
作者:禅与计算机程序设计艺术1.简介SpringBoot是微服务开发的一个重要工具。它可以快速、轻松地创建一个独立运行的应用,同时还有一个特性就是它可以让开发者更关注业务逻辑而不是配置。SpringCloud生态圈则提供了许多服务发现、熔断器等功能组件,可以帮助我们实现微服务之间的通信、监控、路由等功能。但是,如果想要把SpringBoot部署到Kubernetes集群上,那么就需要做一些额外的工
MySQL实战教程:从小白到大神的进阶之路!
奔跑吧邓邓子
项目实战 mysql 数据库
目录一、MySQL概述1、MySQL简介1.1MySQL的历史背景1.2MySQL的特点1.3MySQL的应用场景1.4MySQL的版本2、MySQL发展历程2.1MySQL的起源2.2MySQL的早期发展2.3MySQL的成熟与普及2.4MySQL的商业化与收购2.5MySQL的持续创新3、MySQL应用场景3.1Web应用程序3.2企业级应用3.3大数据分析3.4移动应用3.5云计算3.6物联
01背包与完全背包:正序Or倒叙遍历背包数究竟什么区别
社恐不参团
算法 动态规划
01背包与完全背包:正序Or倒叙遍历背包数究竟什么区别第一次写,真的菜鸡的感性理解,如有理解错误之处,希望评论区多多指导刚开始学背包问题,虽然背代码很容易,但是着实蒙蔽此篇小文希望给新手一些帮助,放代码!//01背包问题for(inti=1;i>v>>w;//边输入边处理for(intj=m;j>=v;j--)//倒叙遍历背包数f[j]=max(f[j],f[j-v]
全面掌握React:2025年学习路径指南
chenNorth。
前端 react react.js 学习 前端
文章目录第一步:Web开发的基石——JavaScript与TypeScript第二步:Web设计的核心——HTML与CSS第三步:进入React的世界第四步:用TailwindCSS进行样式设计第五步:用Shadcn/UI增强你的UI第六步:用ReactHookForm处理表单第七步:用Next.js提升你的技能第八步:用Remix掌握全栈开发第九步:ReactNative+Expo:轻松开发移动
探索Java新境界:JDK 15.0.1 Windows 64位安装与环境配置指南
房莺耘
探索Java新境界:JDK15.0.1Windows64位安装与环境配置指南【下载地址】JDK15.0.1Windows64位安装与环境配置指南分享JDK15.0.1Windows64位安装与环境配置指南欢迎使用JDK15.0.1,这是Oracle在2020年发布的Java开发套件的一个更新版本项目地址:https://gitcode.com/Resource-Bundle-Collection/
Linux系统python虚拟环境及HanLP部署
段智华
在Linux系统中运行HanLP,要安装部署一个Python的虚拟环境,实现Python2与Python3的版本共存,Python虚拟环境与JavaJVM虚拟机的共存,HanLP是面向生产环境的多语种NLP工具包,HanLp的标记是一只蝴蝶,蝴蝶象征着蝴蝶效应、非线性与混沌理论——虽然微小,但足以改变世界!(《自然语言处理入门》图书作者何晗)Linuxopenssl、libssl-dev等模块安装
2025年:网络安全犯罪活动发展新趋势
网安加社区
网络安全 网络风险 网络犯罪
2024年,网络空间经历了一场前所未有的动荡,威胁行为者的活动频繁且多变,这一系列事件为2025年的网络安全形势蒙上了一层阴影,预示着挑战依旧严峻。为了深入了解并有效应对勒索软件及其他网络犯罪活动的新趋势,我们与业界领先的安全专家进行了交流探讨,以期帮助企业组织全面认知可能面临的风险,并据此制定出切实有效的防御策略。勒索软件生态系统的持续扩张勒索软件生态系统正以前所未有的速度发展,不断适应并规避防
2025年企业网络安全:风险预测与应对策略
网安加社区
网络安全 网络风险 企业安全
据预测,到2025年,网络犯罪可能给全球经济带来每年高达10.5万亿美元的损失。这一个惊人的数字,为各行各业敲响了警钟。随着网络威胁日益复杂多变,企业要保持领先地位,就必须时刻保持警惕,勇于创新,采取积极主动的防御策略。那么,2025年的企业网络安全领域将面临哪些挑战?企业又该如何做好准备?接下来,我们一同深入探讨企业网络安全的发展趋势与应对策略。2025年企业网络安全风险如今,企业的网络安全已不
Simula语言的区块链
慕璃嫣
包罗万象 golang 开发语言 后端
Simula语言与区块链技术的交汇:构建下一个世代的智能合约引言区块链技术自2008年比特币白皮书发布以来,迅速发展成为一个重要的技术领域。它以去中心化、透明性和不可篡改性为核心特征,为各种应用提供了新的解决方案。在众多编程语言中,Simula语言虽不如Solidity、Go或Rust等更为流行,但其在面向对象编程(OOP)中的创新却为区块链应用的发展提供了独特的视角。本文将探讨Simula语言的
Haskell语言的编程范式
编程|诗人
包罗万象 golang 开发语言 后端
Haskell语言的编程范式及其魅力引言Haskell是一种纯粹的函数式编程语言,自1987年首次发布以来,它一直在学术界和工业界保持着相对高的关注度。Haskell的编程范式与传统的命令式编程有着显著的不同,提供了一种更加优雅和强大的方式来处理计算和数据。本文将详细探讨Haskell语言的编程范式、其核心特性、以及在实际应用中的优势和局限性。一、编程范式的概念编程范式是指编程语言使用的基本风格或
LeetCode[位运算] - #137 Single Number II
Cwind
java Algorithm LeetCode 题解 位运算
原题链接:#137 Single Number II
要求:
给定一个整型数组,其中除了一个元素之外,每个元素都出现三次。找出这个元素
注意:算法的时间复杂度应为O(n),最好不使用额外的内存空间
难度:中等
分析:
与#136类似,都是考察位运算。不过出现两次的可以使用异或运算的特性 n XOR n = 0, n XOR 0 = n,即某一
《JavaScript语言精粹》笔记
aijuans
JavaScript
0、JavaScript的简单数据类型包括数字、字符创、布尔值(true/false)、null和undefined值,其它值都是对象。
1、JavaScript只有一个数字类型,它在内部被表示为64位的浮点数。没有分离出整数,所以1和1.0的值相同。
2、NaN是一个数值,表示一个不能产生正常结果的运算结果。NaN不等于任何值,包括它本身。可以用函数isNaN(number)检测NaN,但是
你应该更新的Java知识之常用程序库
Kai_Ge
java
在很多人眼中,Java 已经是一门垂垂老矣的语言,但并不妨碍 Java 世界依然在前进。如果你曾离开 Java,云游于其它世界,或是每日只在遗留代码中挣扎,或许是时候抬起头,看看老 Java 中的新东西。
Guava
Guava[gwɑ:və],一句话,只要你做Java项目,就应该用Guava(Github)。
guava 是 Google 出品的一套 Java 核心库,在我看来,它甚至应该
HttpClient
120153216
httpclient
/**
* 可以传对象的请求转发,对象已流形式放入HTTP中
*/
public static Object doPost(Map<String,Object> parmMap,String url)
{
Object object = null;
HttpClient hc = new HttpClient();
String fullURL
Django model字段类型清单
2002wmj
django
Django 通过 models 实现数据库的创建、修改、删除等操作,本文为模型中一般常用的类型的清单,便于查询和使用: AutoField:一个自动递增的整型字段,添加记录时它会自动增长。你通常不需要直接使用这个字段;如果你不指定主键的话,系统会自动添加一个主键字段到你的model。(参阅自动主键字段) BooleanField:布尔字段,管理工具里会自动将其描述为checkbox。 Cha
在SQLSERVER中查找消耗CPU最多的SQL
357029540
SQL Server
返回消耗CPU数目最多的10条语句
SELECT TOP 10
total_worker_time/execution_count AS avg_cpu_cost, plan_handle,
execution_count,
(SELECT SUBSTRING(text, statement_start_of
Myeclipse项目无法部署,Undefined exploded archive location
7454103
eclipse MyEclipse
做个备忘!
错误信息为:
Undefined exploded archive location
原因:
在工程转移过程中,导致工程的配置文件出错;
解决方法:
 
GMT时间格式转换
adminjun
GMT 时间转换
普通的时间转换问题我这里就不再罗嗦了,我想大家应该都会那种低级的转换问题吧,现在我向大家总结一下如何转换GMT时间格式,这种格式的转换方法网上还不是很多,所以有必要总结一下,也算给有需要的朋友一个小小的帮助啦。
1、可以使用
SimpleDateFormat SimpleDateFormat
EEE-三位星期
d-天
MMM-月
yyyy-四位年
Oracle数据库新装连接串问题
aijuans
oracle数据库
割接新装了数据库,客户端登陆无问题,apache/cgi-bin程序有问题,sqlnet.log日志如下:
Fatal NI connect error 12170.
VERSION INFORMATION: TNS for Linux: Version 10.2.0.4.0 - Product
回顾java数组复制
ayaoxinchao
java 数组
在写这篇文章之前,也看了一些别人写的,基本上都是大同小异。文章是对java数组复制基础知识的回顾,算是作为学习笔记,供以后自己翻阅。首先,简单想一下这个问题:为什么要复制数组?我的个人理解:在我们在利用一个数组时,在每一次使用,我们都希望它的值是初始值。这时我们就要对数组进行复制,以达到原始数组值的安全性。java数组复制大致分为3种方式:①for循环方式 ②clone方式 ③arrayCopy方
java web会话监听并使用spring注入
bewithme
Java Web
在java web应用中,当你想在建立会话或移除会话时,让系统做某些事情,比如说,统计在线用户,每当有用户登录时,或退出时,那么可以用下面这个监听器来监听。
import java.util.ArrayList;
import java.ut
NoSQL数据库之Redis数据库管理(Redis的常用命令及高级应用)
bijian1013
redis 数据库 NoSQL
一 .Redis常用命令
Redis提供了丰富的命令对数据库和各种数据库类型进行操作,这些命令可以在Linux终端使用。
a.键值相关命令
b.服务器相关命令
1.键值相关命令
&
java枚举序列化问题
bingyingao
java 枚举 序列化
对象在网络中传输离不开序列化和反序列化。而如果序列化的对象中有枚举值就要特别注意一些发布兼容问题:
1.加一个枚举值
新机器代码读分布式缓存中老对象,没有问题,不会抛异常。
老机器代码读分布式缓存中新对像,反序列化会中断,所以在所有机器发布完成之前要避免出现新对象,或者提前让老机器拥有新增枚举的jar。
2.删一个枚举值
新机器代码读分布式缓存中老对象,反序列
【Spark七十八】Spark Kyro序列化
bit1129
spark
当使用SparkContext的saveAsObjectFile方法将对象序列化到文件,以及通过objectFile方法将对象从文件反序列出来的时候,Spark默认使用Java的序列化以及反序列化机制,通常情况下,这种序列化机制是很低效的,Spark支持使用Kyro作为对象的序列化和反序列化机制,序列化的速度比java更快,但是使用Kyro时要注意,Kyro目前还是有些bug。
Spark
Hybridizing OO and Functional Design
bookjovi
erlang haskell
推荐博文:
Tell Above, and Ask Below - Hybridizing OO and Functional Design
文章中把OO和FP讲的深入透彻,里面把smalltalk和haskell作为典型的两种编程范式代表语言,此点本人极为同意,smalltalk可以说是最能体现OO设计的面向对象语言,smalltalk的作者Alan kay也是OO的最早先驱,
Java-Collections Framework学习与总结-HashMap
BrokenDreams
Collections
开发中常常会用到这样一种数据结构,根据一个关键字,找到所需的信息。这个过程有点像查字典,拿到一个key,去字典表中查找对应的value。Java1.0版本提供了这样的类java.util.Dictionary(抽象类),基本上支持字典表的操作。后来引入了Map接口,更好的描述的这种数据结构。
&nb
读《研磨设计模式》-代码笔记-职责链模式-Chain Of Responsibility
bylijinnan
java 设计模式
声明: 本文只为方便我个人查阅和理解,详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/
/**
* 业务逻辑:项目经理只能处理500以下的费用申请,部门经理是1000,总经理不设限。简单起见,只同意“Tom”的申请
* bylijinnan
*/
abstract class Handler {
/*
Android中启动外部程序
cherishLC
android
1、启动外部程序
引用自:
http://blog.csdn.net/linxcool/article/details/7692374
//方法一
Intent intent=new Intent();
//包名 包名+类名(全路径)
intent.setClassName("com.linxcool", "com.linxcool.PlaneActi
summary_keep_rate
coollyj
SUM
BEGIN
/*DECLARE minDate varchar(20) ;
DECLARE maxDate varchar(20) ;*/
DECLARE stkDate varchar(20) ;
DECLARE done int default -1;
/* 游标中 注册服务器地址 */
DE
hadoop hdfs 添加数据目录出错
daizj
hadoop hdfs 扩容
由于原来配置的hadoop data目录快要用满了,故准备修改配置文件增加数据目录,以便扩容,但由于疏忽,把core-site.xml, hdfs-site.xml配置文件dfs.datanode.data.dir 配置项增加了配置目录,但未创建实际目录,重启datanode服务时,报如下错误:
2014-11-18 08:51:39,128 WARN org.apache.hadoop.h
grep 目录级联查找
dongwei_6688
grep
在Mac或者Linux下使用grep进行文件内容查找时,如果给定的目标搜索路径是当前目录,那么它默认只搜索当前目录下的文件,而不会搜索其下面子目录中的文件内容,如果想级联搜索下级目录,需要使用一个“-r”参数:
grep -n -r "GET" .
上面的命令将会找出当前目录“.”及当前目录中所有下级目录
yii 修改模块使用的布局文件
dcj3sjt126com
yii layouts
方法一:yii模块默认使用系统当前的主题布局文件,如果在主配置文件中配置了主题比如: 'theme'=>'mythm', 那么yii的模块就使用 protected/themes/mythm/views/layouts 下的布局文件; 如果未配置主题,那么 yii的模块就使用 protected/views/layouts 下的布局文件, 总之默认不是使用自身目录 pr
设计模式之单例模式
come_for_dream
设计模式 单例模式 懒汉式饿汉式 双重检验锁失败 无序写入
今天该来的面试还没来,这个店估计不会来电话了,安静下来写写博客也不错,没事翻了翻小易哥的博客甚至与大牛们之间的差距,基础知识不扎实建起来的楼再高也只能是危楼罢了,陈下心回归基础把以前学过的东西总结一下。
*********************************
8、数组
豆豆咖啡
二维数组 数组 一维数组
一、概念
数组是同一种类型数据的集合。其实数组就是一个容器。
二、好处
可以自动给数组中的元素从0开始编号,方便操作这些元素
三、格式
//一维数组
1,元素类型[] 变量名 = new 元素类型[元素的个数]
int[] arr =
Decode Ways
hcx2013
decode
A message containing letters from A-Z is being encoded to numbers using the following mapping:
'A' -> 1
'B' -> 2
...
'Z' -> 26
Given an encoded message containing digits, det
Spring4.1新特性——异步调度和事件机制的异常处理
jinnianshilongnian
spring 4.1
目录
Spring4.1新特性——综述
Spring4.1新特性——Spring核心部分及其他
Spring4.1新特性——Spring缓存框架增强
Spring4.1新特性——异步调用和事件机制的异常处理
Spring4.1新特性——数据库集成测试脚本初始化
Spring4.1新特性——Spring MVC增强
Spring4.1新特性——页面自动化测试框架Spring MVC T
squid3(高命中率)缓存服务器配置
liyonghui160com
系统:centos 5.x
需要的软件:squid-3.0.STABLE25.tar.gz
1.下载squid
wget http://www.squid-cache.org/Versions/v3/3.0/squid-3.0.STABLE25.tar.gz
tar zxf squid-3.0.STABLE25.tar.gz &&
避免Java应用中NullPointerException的技巧和最佳实践
pda158
java
1) 从已知的String对象中调用equals()和equalsIgnoreCase()方法,而非未知对象。 总是从已知的非空String对象中调用equals()方法。因为equals()方法是对称的,调用a.equals(b)和调用b.equals(a)是完全相同的,这也是为什么程序员对于对象a和b这么不上心。如果调用者是空指针,这种调用可能导致一个空指针异常
Object unk
如何在Swift语言中创建http请求
shoothao
http swift
概述:本文通过实例从同步和异步两种方式上回答了”如何在Swift语言中创建http请求“的问题。
如果你对Objective-C比较了解的话,对于如何创建http请求你一定驾轻就熟了,而新语言Swift与其相比只有语法上的区别。但是,对才接触到这个崭新平台的初学者来说,他们仍然想知道“如何在Swift语言中创建http请求?”。
在这里,我将作出一些建议来回答上述问题。常见的
Spring事务的传播方式
uule
spring事务
传播方式:
新建事务
required
required_new - 挂起当前
非事务方式运行
supports
&nbs