这样的标签，HTML 的初衷是表达“这是标题”、“这是段落”、“这是表格”之类的信息。同时文档布局由浏览器来完成，而不使用任何的格式化标签。
由于两种主要的浏览器（Netscape 和 Internet Explorer）不断地将新的 HTML 标签和属性（比如字体标签和颜色属性）添加到 HTML 规范中，创建文档内容清晰地独立于文档表现层的站点变得越来越困难。
为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。
所有的主流浏览器均支持层叠样式表。
多重样式将层叠为一个
样式表允许以多种方式规定样式信息。样式可以规定在单个的 HTML 元素中，在 HTML 页的头元素中，或在一个外部的 CSS 文件中。甚至可以在同一个 HTML 文档内部引用多个外部样式表。
层叠次序
当同一个 HTML 元素被不止一个样式定义时，会使用哪个样式呢？
一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。
浏览器缺省设置
外部样式表
内部样式表（位于 标签内部）
内联样式（在 HTML 元素内部）
因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明：
标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。
一、css的语法
格式：
选择器{属性:值;属性:值;属性:值;....}
其中选择器也叫选择符
CSS中注释：
/* ... */
二、在HTML中如何使用css样式（html中嵌入css的方式）
内联方式（行内样式）被修饰的内容 ``
在HTML中如何使用css样式
内部方式（内嵌样式）
外部导入方式（外部链入）
link属于html，而@import则属于css
@import 不能写在内嵌样式的上方 否则样式无效
加载顺序区别
兼容性区别
三、**css2的选择符：
html选择符（标签选择器）
就是把html标签作为选择符使用
h2{....} 网页中所有h2标签采用此样式
class类选择符 (使用点.将自定义名（类名）来定义的选择符)（类选择器）
定义： .类名{样式....} 匿名类
其他选择符名.类名{样式....}...
.mc{color:blue;} /* 凡是class属性值为mc的都采用此样式 */
p .ps{color:green;} /只有p标签中class属性值为ps的才采用此样式 /
注意：类选择符可以在网页中重复使用
3.Id选择符(ID选择器)
定义： #id名{样式.....}...
注意：id选择符只在网页中使用一次
选择符的优先级：从大到小 [ID选择符]->[class选择符]->[html选择符]->[html属性]
4.关联选择符（包含选择符）
格式： 选择符1 选择符2 选择符3 ...{样式....}table标签里的a标签才采用此样式 /
h1 p{color:red} /*只有h1标签中的p标签才采用此样式*/
5.组合选择符（选择符组）
格式： 选择符1,选择符2,选择符3 ...{样式....}
h3,h4,h5{color:green;} /*h3、h4和h5都采用此样式*/
6.*通配符（全局选择器）
说明：
通配符的写法是“*”，其含义就是所有元素。
用法：
常用来重置样式
*{ padding:0; margin:0;}
伪类选(伪元素)择符：
a:visited {color: #00FF00; text-decoration: none} /* 已访问的链接 */
a:hover {color: #FF00FF; text-decoration: underline} /* 鼠标在链接上 */
a:active {color: #0000FF; text-decoration: underline} /* 激活链接 */
为了简化代码，可以把伪类选择符中相同的声明提出来放在a选择符中；
属性选择器：
其他伪类选择器
优先级:行内->css3选择器->id->class->html->html属性
四、 CSS3中的选择器
关系选择器：
div>p 选择所有作为div元素的子元素p
属性选择器：
[attribute]选择具有attribute属性的元素。
div[class|="a"] class="a-test"
[attibute^=value]匹配具有attribute属性、且值以valule开头的E元素
CSS 伪类用于向某些选择器添加特殊的效果。
结构性伪类选择器：
::first-letter设置对象内的第一个字符的样式。
定义和用法
:before 选择器在被选元素的内容前面插入内容。
请使用 content 属性来指定要插入的内容。
content不能省略
:after设置在对象后（依据对象树的逻辑结构）发生的内容。
定义和用法
:before 选择器在被选元素的内容后面插入内容。
请使用 content 属性来指定要插入的内容。
content不能省略
:first-of-type匹配同类型中的第一个同级兄弟元素
:only-of-type匹配同类型中的唯一的一个同级兄弟元素
:nth-last-of-type(n) 匹配同类型中的倒数第几个同级兄弟元素
:nth-of-type(n) 匹配同类型中的第几个同级兄弟元素
:only-child匹配父元素仅有的一个子元素
:nth-child(n)匹配父元素的第n个子元素
实例：
li:nth-child(2n){color:#f00;} /* 偶数 */
li:nth-child(2n+1){color:#000;} /* 奇数 */
child和type区别:
child所指定的必须为第一个或者最后一个 否则不生效 但是type可以
:root匹配元素在文档的根元素。在HTML中，根元素永远是HTML
.demo li:not(:last-child) {
border-bottom: 1px solid #ddd;
}
上述代码的意思是：给该列表中除最后一项外的所有列表项加一条底边线
*状态伪类选择器
:link 设置超链接a在未被访问前的样式。
#my_md:target{}
:enabled 匹配用户界面上处于可用状态的元素
实例：
input:checked + span {
background: #f00;
}
input:checked + span:after {
content: " 我被选中了";
}
::selection 设置对象被选择时的样式
实例：
p::selection{background:#000;color:#f00;}
你选中这段文字后，看看它们的文本颜色和背景色，就能明白::selection的作用。
只能定义被选择时的background-color，color及text-shadow(IE11尚不支持定义该属性)。
!important 应用优先权
伪类就是创建了一个假的类名；伪元素就是创建了一个假的元素标签。
同样举例说明伪元素（就是创建了假的元素）：如让
啊啦啦啦
里面的啊变颜色啊啦啦啦
然后span{color:red}======================================================================================
五、CSS中常用的属性：
(1) color颜色属性：
a. HSL颜色: 通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色.
background-color: hsl(240,100%,50%);color:white；
b. HSLA颜色: 色调(H)、饱和度(S)、亮度(L)、透明度(A)；
background-color: hsla(0,100%,50%,0.2);
*c. RGB颜色: 红(R)、绿(G)、蓝(B)三个颜色通道的变化
background-color: rgba(200,100,0);
d. RGBA颜色: 红(R)、绿(G)、蓝(B)、透明度(A)
background-color: rgba(0,0,0,0.5);
*e. 图片透明度的设置 img.opacity{ opacity:0.25;}
兼容IE8 filter:alpha(opacity=100);
颜色的使用:
颜色的英文单词
十六进制
rgb
(2) 字体属性： font
font
<' font-style '>： 指定文本字体样式
(3) 文本属性：
text-indent: 首行缩进：2em text-indent:30px;
*text-shadow: 文本的文字是否有阴影及模糊效果
white-space:nowrap; /* 强制在同一行内显示所有文本*/
*letter-spacing: 文字或字母的间距
(4) *边框：
border:宽度 样式 颜色;
border-color;
border-style; 边框样式：solid实现，dotted点状线，dashed虚线
border-width:
border-left-color;
border-left-style;
border-left-width:
...
CSS3的样式
border-radius：圆角处理
box-shadow: 设置或检索对象阴影
三角
div{
border: 14px solid #FFF;
width:0;
height: 0;
border-bottom-color:red;
}
(5) 背景属性：background
*background-color: 背景颜色
repeat-x 按照x轴平铺
repeat-y 按照y轴平铺
no-repeat 不平铺
*background-position：定位
center： 背景图像横向和纵向居中。
left： 背景图像在横向上填充从左边开始。
right： 背景图像在横向上填充从右边开始。
top： 背景图像在纵向上填充从顶部开始。
bottom： 背景图像在纵向上填充从底部开始。
background-attachment：[əˈtætʃmənt] 是否固定背景，
scroll:默认值。背景图像是随对象内容滚动
fixed:背景图像固定
css3的属性
*background-size: 背景大小，如 background-size:100px 140px;
组合写法：
background: green url("./sc/1.gif") no-repeat center/200px 300px scroll;
多层背景：
(6) *内补白（内补丁）
padding： 检索或设置对象四边的内部边距,如padding:10px; padding:5px 10px;
盒子模型
css定义所有的元素都可以拥有像盒子一样的外形和平面空间，即都包含边框（border)、外边距(margin)、内边距(padding)、内容区(content)。
怪异盒子模型
/* 切换盒子模型计算方式
*
* 从边框左边到边框右边之间的距离 才是width
* 计算宽度非常方便
*
*/
box-sizing: border-box;
(7) *外补白（外补丁）
margin： 检索或设置对象四边的外延边距,如 margin:10px; margin:5px auto;
注意：
外边距的上下距离会重叠 左右不会重叠
(8) Position定位
*position: 定位方式：absolute(绝对定位)、fixed(固定)（relative定位参考，可对内部相对absolute定位）
总结：
fixed和absolute绝对定位 不会保留其物理空间 设置当前定位的元素会漂浮在其它元素的上方
定位会参照外层的定位而定位 如果外层嵌套的标签不存在定位 则会按照body体进行定位
fixed和absolute使用除了fixed会随着滚动条的滚动而滚动之外 使用方式一样的
设置div相对于浏览器居中显示
position:absolute;
left:0;
top:0;
bottom:0;
right: 0;
margin: auto;
(9) Layout布局
*display： 是否及如何显示：
none隐藏
block块状显示
inline 行级
inline-block 行级的块级标签
*overflow:超出隐藏：hidden，visible：不剪切内容
图片格式（了解）
png 常用的网络传输格式，开发中用的最多的格式 HTML常用，
移动开发（Android，IOS，WP）,这个格式文件失真率低
jpg 比较常用的图片格式，压缩性能比较高，不支持透明像素 失真率比较高
gif 动态图片，不透明的，占用空间比较高
psd Photoshop的原图，PS超级大，但是可以保留图片原始所有资料
webp Google定义的，它集合了png和jpg的优点
新增CSS3选择器及属性只需在选择器或属性前加上相对应的浏览器前缀即可
-webkit- Chrome
(10) 用户界面 User Interface
*cursor 鼠标指针采用何种系统预定义的光标形状。pointer小手，url自定义
zoom 设置或检索对象的缩放比例： normal|5倍|200%百分比
content-box： padding和border不被包含在定义的width和height之内。
resize 设置或检索对象的区域是否允许用户缩放，调节元素尺寸大小。
none： 不允许用户调整元素大小。
both： 用户可以调节元素的宽度和高度。
horizontal： 用户可以调节元素的宽度
vertical： 用户可以调节元素的高度。
outline 复合属性：设置或检索对象外的线条轮廓
outline-width设置或检索对象外的线条轮廓的宽度
(11) 表格相关属性：
border-collapse 设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开 separate | collapse
(12) 过渡 Transition:
transition 检索或设置对象变换时的过渡效果
(13) 动画 Animation
animation 检索或设置对象所应用的动画特效
(14) 2D变换 2D Transform:
transform 检索或设置对象的变换
你可能感兴趣的:(css入门)
Flask框架入门：快速搭建轻量级Python网页应用
「已注销」
python-AI python基础 网站网络 python flask 后端
转载：Flask框架入门：快速搭建轻量级Python网页应用1.Flask基础Flask是一个使用Python编写的轻量级Web应用框架。它的设计目标是让Web开发变得快速简单，同时保持应用的灵活性。Flask依赖于两个外部库：Werkzeug和Jinja2，Werkzeug作为WSGI工具包处理Web服务的底层细节，Jinja2作为模板引擎渲染模板。安装Flask非常简单，可以使用pip安装命令
Python Flask 框架入门：快速搭建 Web 应用的秘诀
Python编程之道
Python人工智能与大数据 Python编程之道 python flask 前端 ai
PythonFlask框架入门：快速搭建Web应用的秘诀关键词Flask、微框架、路由系统、Jinja2模板、请求处理、WSGI、Web开发摘要想快速用Python搭建一个灵活的Web应用？Flask作为“微框架”代表，凭借轻量、可扩展的特性，成为初学者和小型项目的首选。本文将从Flask的核心概念出发，结合生活化比喻、代码示例和实战案例，带你一步步掌握：如何用Flask搭建第一个Web应用？路由
精通Canvas：15款时钟特效代码实现指南
烟幕缭绕
本文还有配套的精品资源，点击获取简介：HTML5的Canvas是一个用于绘制矢量图形的API，通过JavaScript实现动态效果。本项目集合了15种不同的时钟特效代码，帮助开发者通过学习绘制圆形、线条、时间更新、旋转、颜色样式设置及动画效果等概念，深化对Canvas的理解和应用。项目中的CSS文件负责时钟的样式设定，而JS文件则包含实现各种特效的逻辑，通过不同的函数或类处理时间更新和动画绘制，提
FPGA小白到项目实战：Verilog+Vivado全流程通关指南（附光学类岗位技能映射）
阿牛的药铺
算法移植部署 fpga开发 verilog
FPGA小白到项目实战：Verilog+Vivado全流程通关指南（附光学类岗位技能映射）引言：为什么这个FPGA入门路线能帮你快速上岗？本文设计了一条**"Verilog语法→工具链操作→光学项目实战→岗位技能对标"的阶梯式学习路径。不同于泛泛而谈的FPGA教程，我们聚焦光学类产品开发**核心能力（时序接口设计、图像处理算法移植、高速接口应用），通过3个递进式项目（从LED闪烁到图像边缘检测），
MySQL Explain 详解：从入门到精通，让你的 SQL 飞起来
引言：为什么Explain是SQL优化的“照妖镜”？在Java开发中，我们常常会遇到数据库性能瓶颈的问题。一条看似简单的SQL语句，在数据量增长到一定规模后，可能会从毫秒级响应变成秒级甚至分钟级响应，直接拖慢整个应用的性能。此时，你是否曾困惑于：为什么这条SQL突然变慢了？索引明明建了，为什么没生效？到底是哪里出了问题？答案就藏在MySQL的EXPLAIN命令里。EXPLAIN就像一面“照妖镜”，
小林渗透入门：burpsuite+proxifier抓取小程序流量
ξ流ぁ星ぷ132
小程序 web安全 安全性测试 网络安全 安全
目录前提：代理：proxifier：步骤：bp证书安装bp设置代理端口：proxifier设置规则：proxifier应用规则：结果：前提：在介绍这两个工具具体实现方法之前，有个很重要的技术必须要大概了解才行---代理。代理：个人觉得代理，简而言之，就是在你和服务器中间的一个中间人，来转达信息。那为什么要代理呢，因为这里的burpsuite要抓包，burpsuite只有做为中间代理人才可以进行拦截
入门html这篇文章就够了
ξ流ぁ星ぷ132
html 前端
HTML笔记文章目录HTML笔记html介绍什么是htmlhtml的作用HTML标签介绍常用标签标签and标签and标签u标签del删除线br标签用于换行pre标签，预处理标签span标签div标签sub标签andsup标签hr标签h1,h2...h6标签：HTML5中的语义标签：特殊字符img标签a标签第一种用法：超链接第二种用法：锚点video标签表格标签：form标签input标签selec
深入了解 Vim 编辑器：从入门到精通
誰能久伴不乏
编辑器 vim linux
文章目录深入了解Vim编辑器：从入门到精通一、Vim的三个基本模式1.普通模式（NormalMode）2.插入模式（InsertMode）3.命令模式（CommandMode）二、常用快捷键光标移动删除操作复制和粘贴撤销和重做三、文件操作与搜索文件操作搜索文本替换文本四、Vim的进阶功能多文件编辑分屏功能标签页查看帮助五、总结深入了解Vim编辑器：从入门到精通Vim是一个强大的文本编辑器，广泛应用
Flutter——数据库Drift开发详细教程(七)
怀君
flutter flutter 数据库
目录入门设置漂移文件入门变量数组定义表支持的列类型漂移特有的功能导入嵌套结果LIST子查询Dart互操作SQL中的Dart组件类型转换器现有的行类Dart文档注释结果类名称支持的语句自定义SQL类型定义类型使用自定义类型在Dart中在SQL中方言意识支持的SQLite扩展json1fts5地缘垄断自定义查询带有生成的api的语句自定义选择语句自定义更新语句入门Drift提供了一个dart_api来
Ubuntu基础（Python虚拟环境和Vue）
aaiier
ubuntu python linux
Python虚拟环境sudoaptinstallpython3python3-venv进入项目目录cdXXX创建虚拟环境python3-mvenvvenv激活虚拟环境sourcevenv/bin/activate退出虚拟环境deactivateVue安装Node.js和npm#安装Node.js和npm（Ubuntu默认仓库可能版本较旧，适合入门）sudoaptinstallnodejsnpm#验
GoView 强势入驻 GitCode：拖拽低代码，打造高颜值数据大屏
GitCode 代码君
gitcode 低代码 开源
信息可视化时代，数字大屏日益成为展示核心KPI、运营状态、监控预警的主流形式。然而，用传统方式开发一个定制化数字大屏需要解决多少问题？1.繁复的数据源集成，各种不同的协议和格式……2.让人晕头转向的可视化逻辑，调动艰难的样式、布局、动画，和往往难以统一的风格3.牵一发而动全身的代码结构，就想换个主题色结果开启的全局CSS大冒险……现在，一个开源项目即可搞定上述问题——拖拽式低代码数字可视化平台Go
苦练Python第5天：字符串从入门到格式化
python后端人工智能前端
苦练Python第5天：字符串从入门到格式化原文链接：https://dev.to/therahul_gupta/day-5100-working-with-strings-basics-to-formatting-2kkn作者：RahulGupta译者：倔强青铜三前言大家好，我是倔强青铜三。是一名热情的软件工程师，我热衷于分享和传播IT技术，致力于通过我的知识和技能推动技术交流与创新，欢迎关注我
Flutter——数据库Drift开发详细教程之迁移(九)
怀君
flutter flutter 数据库
迁移入门引导式迁移配置用法例子切换到make-migrations开发过程中手动迁移迁移后回调导出模式导出架构下一步是什么？调试导出架构的问题修复这个问题架构迁移助手自定义分步迁移转向逐步迁移手动生成测试迁移编写测试验证数据完整性在运行时验证数据库模式迁移器API一般提示迁移视图、触发器和索引复杂的迁移更改列的类型更改列约束删除列重命名列合并列添加新列入门Drift通过严格的架构确保查询类型安全。
Vue.js 过渡 & 动画
lsx202406
开发语言
Vue.js过渡&动画引言在Web开发中，过渡与动画是提升用户体验的关键元素。Vue.js作为一款流行的前端框架，提供了强大的过渡与动画功能，使得开发者能够轻松实现丰富的交互效果。本文将深入探讨Vue.js中的过渡与动画，包括其原理、应用场景以及实现方法。一、Vue.js过渡原理Vue.js过渡是利用CSS3的transition属性实现的。当Vue.js侦测到数据变化时，会自动触发过渡效果。过渡
Vue3 tailwindcss
1、安装tailwindcsspnpmi-Dtailwindcsspostcssautoprefixer#yarnadd-Dtailwindcsspostcssautoprefixer#npmi-Dtailwindcsspostcssautoprefixer2、创建TailwindCSS配置文件npxtailwindcssinit-ptailwind.config.js/**@type{impor
css遗忘的知识2(grid布局，&父类选择器与:has() 讲解)
不断努力的根号七
css css 前端 javascript
---grid布局1.基础Grid布局定义gird布局和行宽.container{display:grid;grid-template-columns:100px200px300px;/*三列，宽度分别为100px,200px,300px*/grid-template-rows:100px200px;/*两行，高度分别为100px,200px*/}常用单位fr(fractionalunit)：可用
400多个免费在线编程与计算机科学课程
zhufafa
基础理论 课程 理论 计算机基础 免费
来源：medium作者：DhawalShah五年前，麻省理工学院和斯坦福大学等学校首先向公众开放免费的在线课程。如今，全球有700多所学校创造了数以千计的免费在线课程。从入门到精通系列，是作者通过ClassCentral的课程数据库整理的400多个免费在线课程的简介和链接（来源于ClassCentral，一个在线课程搜索引擎），根据课程难度分为入门、进阶和高阶三大类，每门课程还有星级评分（统计自C
Webpack5 多页面实践
特性维度单页面应用-SPA多页面统一目录-MPA多页面单独部署-MPA入口数量单个，只有一个HTML文件多个，多个HTML文件多个，多个HTML文件，分别打包输出资源输出结构所有资源输出到统一目录（如js/,css/）所有页面的资源共用js/,css/等目录每页资源放在各自目录（如index/js/,index/css/）公共资源复用高：依赖打入主包或懒加载chunk，资源完全共享中：可通过spl
初学者如何选购性价比国产电钢琴？
指尖跃动的 C 大调
电钢琴
内容概要本文专为初学者设计，系统解析选购性价比国产电钢琴的关键要点。我们将从选购指南入手，深入探讨手感还原度（如逐级重锤技术和实木琴键设计）、音质稳定性（高复音数确保不跑音）、实用功能（如耳机插孔避免扰民）及性价比策略（低价位结合零调音成本）。随后，推荐高性价比型号，例如贝琪电钢琴，并全面分析其优缺点，帮助读者明智决策。此外，常见问题部分将解答入门常见困惑。为清晰展示核心内容，下表概述文章结构：文
Python入门--day04--Python 推导式、常见语句和内置函数总结
the time zips by
# Python基础 python 开发语言
文章目录前言一、推导式1.列表推导式2.集合推导式3.字典推导式4.生成器推导式二、常见语句1赋值语句2.控制语句2.1条件语句2.1.1if-elif-else2.1.2match-case2.2循环语句2.2.1for循环2.2.2while循环2.3循环控制语句2.3.1break2.3.2continue2.3.3pass3.range语句3.函数定义语句4.异常处理语句4.1try-ex
全面探索Kafka：架构、应用与流处理
Kafka：企业级消息系统与流处理平台的深度解析ApacheKafka作为分布式流处理平台，广泛应用于大数据处理和实时分析领域。本文将基于其官方文档，详细探讨Kafka的核心功能、应用场景以及如何进行有效管理。背景简介Kafka作为高吞吐量的消息系统，支持企业级的发布-订阅模式。它能够处理大量实时数据，并支持高并发读写操作。本文将依据Kafka官方文档的内容，逐层深入，从入门到高级应用，帮助读者全
RabbitMQ 消息队列：从入门到Spring Boot实战
无糖星轨
rabbitmq spring boot java
RabbitMQ作为一款开源的、基于AMQP（AdvancedMessageQueuingProtocol）协议实现的消息代理，凭借其强大的功能、灵活的路由机制以及出色的性能，在业界得到了广泛的应用。无论是处理高并发订单、异步通知、日志收集还是系统解耦，RabbitMQ都能发挥其独特的作用。1.RabbitMQ核心概念RabbitMQ的强大功能离不开其背后一系列精心设计的核心概念。理解这些概念是掌
配置Nginx实现静态资源访问
Gappsong874
nginx 运维 网络安全 web安全 安全架构 运维开发
Nginx是一款高性能的HTTP和反向代理服务器，常用于处理静态资源请求。通过合理配置，可以显著提升静态资源的访问速度和服务器性能。以下内容将详细介绍如何配置Nginx以实现静态资源的高效访问。基本静态资源配置静态资源通常包括HTML文件、CSS样式表、JavaScript脚本、图片、视频等。Nginx通过简单的配置即可处理这些请求。在Nginx的配置文件中，通常位于/etc/nginx/ngin
史上最硬核！Claude Code全链路生存指南（碎碎念加强版）
朋友们，别再问了，ClaudeCode到底怎么用？今天来一份“全链路生存指南”，不藏私，细到毛孔，啰嗦到你嫌烦。你要的不是“入门”，是“活下去”，是“用到极致”！话糙理不糙，能落地。目录ClaudeCode到底是个啥？安装方法（别怕，命令全给你写明白）基础使用（从0到1，别跳步）MCP集成（外部服务、数据库全搞定）配置系统（全局、项目、环境变量，细节全在这）安全和权限管理（别让AI乱动你家底）思考
JQ+vue实现图片拼接（无限套娃版）
小周同学:
js vue jquery vue.js javascript jquery
css样式/*css初始化*/*{margin:0;padding:0;}/*去掉li的小圆点*/li{list-style:none;}/*去掉a的下划线*/a{text-decoration:none;}/*搜索框去除边框*/input,button,select{border:0;/*设置背景颜色为透明*/background-color:transparent;/*去掉外轮廓*/outli
四. go 常见数据结构实现原理之 map
苹果香蕉西红柿
# 二. Go 常见数据结构实现原理 数据结构 golang 哈希算法
目录一.基础hash的基本方案二.map初始化创建map的底层结构hmapbucket桶桶的细节总结minTopHash与是否迁移extra一些重要的常量标志初始化三.插入数据存储数据时key的定位策略四.查询数据五.删除六.扩容扩容策略与扩容大小扩容与数据迁移源码七.总结map底层结构相关问题总结初始化底层总结插入数据底层总结查询数据底层总结扩容底层总结常见问题一.基础在go基础入门十一map集
【ceph】坏盘更换，osd的具体操作
向往风的男子
ceph ceph
本站以分享各种运维经验和运维所需要的技能为主《python零基础入门》：python零基础入门学习《python运维脚本》：python运维脚本实践《shell》：shell学习《terraform》持续更新中：terraform_Aws学习零基础入门到最佳实战《k8》暂未更新《docker学习》暂未更新《ceph学习》ceph日常问题解决分享《日志收集》ELK+各种中间件《运维日常》运维日常《l
前端每周清单第 16 期：JavaScript 模块化现状；Node V8 与V6 真实性能对比
前端每周清单第16期：JavaScript模块化现状；NodeV8与V6真实性能对比；Nuxt.jsSSR与权限验证指南为InfoQ中文站特供稿件，首发地址为这里；如需转载，请与InfoQ中文站联系。从属于笔者的Web前端入门与工程实践的前端每周清单系列系列；部分文章需要自备梯子。前端每周清单第16期：JavaScript模块化现状；NodeV8与V6真实性能对比；Nuxt.jsSSR与权限验证指
jmeter 性能测试步骤是什么？
1.测试计划2.线程组-设置线程数3.HTTP请求（替换参数）4.用户参数/CSV数据文件设置参数、消息体数据5.集合点（同步定时器）-设置模拟用户数和超时时间6.响应断言（检查点）7.断言结果8.监听器-察看结果树9.监听器-聚合报告10.场景监控、运行10.1配置监听器参数10.2登录服务器启动agent服务jmeter性能测试实战（零基础入门到精通）即学即上手！
2024年运维最新分布式存储ceph osd 常用操作_ceph查看osd对应硬盘(1)，2024年最新Linux运维编程基础教程
2401_83944328
程序员 运维 分布式 ceph
最全的Linux教程，Linux从入门到精通======================linux从入门到精通(第2版)Linux系统移植Linux驱动开发入门与实战LINUX系统移植第2版Linux开源网络全栈详解从DPDK到OpenFlow第一份《Linux从入门到精通》466页====================内容简介====本书是获得了很多读者好评的Linux经典畅销书**《Linu
java责任链模式
3213213333332132
java 责任链模式 村民告县长
责任链模式，通常就是一个请求从最低级开始往上层层的请求，当在某一层满足条件时，请求将被处理，当请求到最高层仍未满足时，则请求不会被处理。
就是一个请求在这个链条的责任范围内，会被相应的处理，如果超出链条的责任范围外，请求不会被相应的处理。
下面代码模拟这样的效果：
创建一个政府抽象类,方便所有的具体政府部门继承它。
package 责任链模式;
/**
*
linux、mysql、nginx、tomcat 性能参数优化
ronin47
一、linux 系统内核参数
/etc/sysctl.conf文件常用参数 net.core.netdev_max_backlog = 32768 #允许送到队列的数据包的最大数目
net.core.rmem_max = 8388608 #SOCKET读缓存区大小
net.core.wmem_max = 8388608 #SOCKET写缓存区大
php命令行界面
dcj3sjt126com
PHP cli
常用选项
php -v
php -i PHP安装的有关信息
php -h 访问帮助文件
php -m 列出编译到当前PHP安装的所有模块
执行一段代码
php -r 'echo "hello, world!";'
php -r 'echo "Hello, World!\n";'
php -r '$ts = filemtime("
Filter&Session
171815164
session
Filter
HttpServletRequest requ = (HttpServletRequest) req;
HttpSession session = requ.getSession();
if (session.getAttribute("admin") == null) {
PrintWriter out = res.ge
连接池与Spring,Hibernate结合
g21121
Hibernate
前几篇关于Java连接池的介绍都是基于Java应用的，而我们常用的场景是与Spring和ORM框架结合，下面就利用实例学习一下这方面的配置。
1.下载相关内容： &nb
[简单]mybatis判断数字类型
53873039oycg
mybatis
昨天同事反馈mybatis保存不了int类型的属性,一直报错，错误信息如下:
Caused by: java.lang.NumberFormatException: For input string: "null"
at sun.mis
项目启动时或者启动后ava.lang.OutOfMemoryError: PermGen space
程序员是怎么炼成的
eclipse jvm tomcat catalina.sh eclipse.ini
在启动比较大的项目时，因为存在大量的jsp页面，所以在编译的时候会生成很多的.class文件，.class文件是都会被加载到jvm的方法区中，如果要加载的class文件很多，就会出现方法区溢出异常 java.lang.OutOfMemoryError: PermGen space.
解决办法是点击eclipse里的tomcat，在
我的crm小结
aijuans
crm
各种原因吧，crm今天才完了。主要是接触了几个新技术：
Struts2、poi、ibatis这几个都是以前的项目中用过的。
Jsf、tapestry是这次新接触的，都是界面层的框架，用起来也不难。思路和struts不太一样，传说比较简单方便。不过个人感觉还是struts用着顺手啊，当然springmvc也很顺手，不知道是因为习惯还是什么。jsf和tapestry应用的时候需要知道他们的标签、主
spring里配置使用hibernate的二级缓存几步
antonyup_2006
java spring Hibernate xml cache
．在spring的配置文件中 applicationContent.xml，hibernate部分加入
xml 代码
<prop key="hibernate.cache.provider_class">org.hibernate.cache.EhCacheProvider</prop>
<prop key="hi
JAVA基础面试题
百合不是茶
抽象实现接口 String类 接口继承 抽象类继承实体类 自定义异常
/* * 栈（stack）：主要保存基本类型（或者叫内置类型）（char、byte、short、 *int、long、 float、double、boolean）和对象的引用，数据可以共享，速度仅次于 * 寄存器（register），快于堆。堆（heap）：用于存储对象。 */ &
让sqlmap文件 "继承" 起来
bijian1013
java ibatis sqlmap
多个项目中使用ibatis , 和数据库表对应的 sqlmap文件（增删改查等基本语句)，dao, pojo 都是由工具自动生成的, 现在将这些自动生成的文件放在一个单独的工程中，其它项目工程中通过jar包来引用 ，并通过"继承"为基础的sqlmap文件，dao,pojo 添加新的方法来满足项
精通Oracle10编程SQL(13)开发触发器
bijian1013
oracle 数据库 plsql
/*
*开发触发器
*/
--得到日期是周几
select to_char(sysdate+4,'DY','nls_date_language=AMERICAN') from dual;
select to_char(sysdate,'DY','nls_date_language=AMERICAN') from dual;
--建立BEFORE语句触发器
CREATE O
【EhCache三】EhCache查询
bit1129
ehcache
本文介绍EhCache查询缓存中数据，EhCache提供了类似Hibernate的查询API，可以按照给定的条件进行查询。
要对EhCache进行查询，需要在ehcache.xml中设定要查询的属性
数据准备
@Before
public void setUp() {
//加载EhCache配置文件
Inpu
CXF框架入门实例
白糖_
spring Web 框架 webservice servlet
CXF是apache旗下的开源框架，由Celtix + XFire这两门经典的框架合成，是一套非常流行的web service框架。
它提供了JAX-WS的全面支持，并且可以根据实际项目的需要，采用代码优先（Code First）或者 WSDL 优先（WSDL First）来轻松地实现 Web Services 的发布和使用，同时它能与spring进行完美结合。
在apache cxf官网提供
angular.equals
boyitech
AngularJS AngularJS API AnguarJS 中文API angular.equals
angular.equals
描述:
比较两个值或者两个对象是不是 相等。还支持值的类型，正则表达式和数组的比较。 两个值或对象被认为是 相等的前提条件是以下的情况至少能满足一项：
两个值或者对象能通过=== （恒等） 的比较
两个值或者对象是同样类型，并且他们的属性都能通过angular
java-腾讯暑期实习生-输入一个数组A[1,2,...n]，求输入B，使得数组B中的第i个数字B[i]=A[0]*A[1]*...*A[i-1]*A[i+1]
bylijinnan
java
这道题的具体思路请参看 何海涛的微博：http://weibo.com/zhedahht
import java.math.BigInteger;
import java.util.Arrays;
public class CreateBFromATencent {
/**
* 题目：输入一个数组A[1,2,...n]，求输入B，使得数组B中的第i个数字B[i]=A
FastDFS 的安装和配置 修订版
Chen.H
linux fastDFS 分布式文件系统
FastDFS Home:http://code.google.com/p/fastdfs/
1. 安装
http://code.google.com/p/fastdfs/wiki/Setup http://hi.baidu.com/leolance/blog/item/3c273327978ae55f93580703.html
安装libevent (对libevent的版本要求为1.4.
[强人工智能]拓扑扫描与自适应构造器
comsci
人工智能
当我们面对一个有限拓扑网络的时候,在对已知的拓扑结构进行分析之后,发现在连通点之后,还存在若干个子网络,且这些网络的结构是未知的,数据库中并未存在这些网络的拓扑结构数据....这个时候,我们该怎么办呢?
那么,现在我们必须设计新的模块和代码包来处理上面的问题
oracle merge into的用法
daizj
oracle sql merget into
Oracle中merge into的使用
http://blog.csdn.net/yuzhic/article/details/1896878
http://blog.csdn.net/macle2010/article/details/5980965
该命令使用一条语句从一个或者多个数据源中完成对表的更新和插入数据. ORACLE 9i 中，使用此命令必须同时指定UPDATE 和INSE
不适合使用Hadoop的场景
datamachine
hadoop
转自：http://dev.yesky.com/296/35381296.shtml。
Hadoop通常被认定是能够帮助你解决所有问题的唯一方案。 当人们提到“大数据”或是“数据分析”等相关问题的时候，会听到脱口而出的回答：Hadoop! 实际上Hadoop被设计和建造出来，是用来解决一系列特定问题的。对某些问题来说，Hadoop至多算是一个不好的选择，对另一些问题来说，选择Ha
YII findAll的用法
dcj3sjt126com
yii
看文档比较糊涂，其实挺简单的：
$predictions=Prediction::model()->findAll("uid=:uid",array(":uid"=>10));
第一个参数是选择条件：”uid=10″。其中:uid是一个占位符，在后面的array(“:uid”=>10)对齐进行了赋值；
更完善的查询需要
vim 常用 NERDTree 快捷键
dcj3sjt126com
vim
下面给大家整理了一些vim NERDTree的常用快捷键了，这里几乎包括了所有的快捷键了，希望文章对各位会带来帮助。
切换工作台和目录
ctrl + w + h 光标 focus 左侧树形目录ctrl + w + l 光标 focus 右侧文件显示窗口ctrl + w + w 光标自动在左右侧窗口切换ctrl + w + r 移动当前窗口的布局位置
o 在已有窗口中打开文件、目录或书签，并跳
Java把目录下的文件打印出来
蕃薯耀
列出目录下的文件 文件夹下面的文件 目录下的文件
Java把目录下的文件打印出来
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 2015年7月11日 11:02:
linux远程桌面----VNCServer与rdesktop
hanqunfeng
Desktop
windows远程桌面到linux，需要在linux上安装vncserver，并开启vnc服务，同时需要在windows下使用vnc-viewer访问Linux。vncserver同时支持linux远程桌面到linux。
linux远程桌面到windows，需要在linux上安装rdesktop，同时开启windows的远程桌面访问。
下面分别介绍，以windo
guava中的join和split功能
jackyrong
java
guava库中，包含了很好的join和split的功能，例子如下：
1） 将LIST转换为使用字符串连接的字符串
List<String> names = Lists.newArrayList("John", "Jane", "Adam", "Tom");
Web开发技术十年发展历程
lampcy
android Web 浏览器 html5
回顾web开发技术这十年发展历程：
Ajax
03年的时候我上六年级，那时候网吧刚在小县城的角落萌生。传奇，大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩，然后接下来的一个小时我一直在，注，册，账，号。
彼时网吧用的512k的带宽，注册的时候，填了一堆信息，提交，页面跳转，嘣，”您填写的信息有误，请重填”。然后跳转回注册页面，以此循环。我现在时常想，如果当时a
架构师之mima-----------------mina的非NIO控制IOBuffer(说得比较好)
nannan408
buffer
1.前言。
如题。
2.代码。
IoService
IoService是一个接口，有两种实现：IoAcceptor和IoConnector；其中IoAcceptor是针对Server端的实现，IoConnector是针对Client端的实现；IoService的职责包括：
1、监听器管理
2、IoHandler
3、IoSession
ORA-00054:resource busy and acquire with NOWAIT specified
Everyday都不同
oracle session Lock
[Oracle]
今天对一个数据量很大的表进行操作时，出现如题所示的异常。此时表明数据库的事务处于“忙”的状态，而且被lock了，所以必须先关闭占用的session。
step1，查看被lock的session：
select t2.username, t2.sid, t2.serial#, t2.logon_time
from v$locked_obj
javascript学习笔记
tntxia
JavaScript
javascript里面有6种基本类型的值:number、string、boolean、object、function和undefined。number：就是数字值，包括整数、小数、NaN、正负无穷。string:字符串类型、单双引号引起来的内容。boolean:true、false object:表示所有的javascript对象，不用多说function:我们熟悉的方法，也就是
Java enum的用法详解
xieke90
enum 枚举
Java中枚举实现的分析：
示例：
public static enum SEVERITY{
INFO,WARN,ERROR
}
enum很像特殊的class，实际上enum声明定义的类型就是一个类。 而这些类都是类库中Enum类的子类 (java.l
