【JavaEE】_CSS常用属性值
目录
1. 字体属性
1.1 设置字体家族 font-family
1.2 设置字体大小 font-size
1.3 设置字体粗细 font-weight
1.4 设置字体倾斜 font-style
2. 文本属性
2.1 设置文本颜色 color
2.2 文本对齐 text-align
2.3 文本装饰 text-decoration
2.4 文本缩进 text-indent
2.5 行高 line-height
3. 背景属性
3.1 背景颜色 background-color
3.2 背景图片 background-image
3.2.1 背景图片平铺设置：background-repeat
3.2.2 背景图片位置设置：background-position
3.2.3 背景图片大小：background-size
4. 圆角矩形
4.2 生成圆角矩形
4.3 生成圆形
5. 元素的显示模式
5.1 块级元素 display:block
5.2 行内元素 display:inline
5.3 块级元素和行内元素的区别
6. CSS盒子模型
6.1 边框
6.2 内边距
6.3 外边距
7. 弹性布局
7.1 开启弹性布局 display
7.2 设置元素的水平排列方式 justify-content
7.3 设置元素的垂直排列方式 align-items
1. 字体属性
1.1 设置字体家族 font-family
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{font-size: 25px;font-family: '微软雅黑';}.two{font-size:25px;font-family:'宋体';}.three{font-size: 25px;font-family: '黑体';}.four{font-size: 25px;font-family: '华文行楷';}</style>
</head>
<body><div class="one">这是第一个div</div><div class="two">这是第二个div</div><div class="three">这是第三个div</div><div class="four">这是第四个div</div>
</body>
</html>运行后页面如下：
注：（1）font-family属性指定的字体要求必须是系统已经安装的字体，上文代码所使用的微软雅黑、宋体、黑体、华文行楷都是windows系统自带的字体，故而直接指定字体是可以正确显示的。
如果需要指定一些特殊字体，系统上没有则不能正确显示。
这种情况一般是需要通过浏览器请求对应的服务器，获取到指定字体文件才能进行设置（一般网站都使用系统自带字体）；
1.2 设置字体大小 font-size
示例代码同上，此处不再赘述；
注：（1）浏览器中的每个文字可视为一个方框，英文与拉丁文的方框可能比较窄，中文的方框一般是正方形，可以将设置字体大小视为设置字体方框的高；
（2）如果需要使用截图工具（如QQ截图、微信截图等）进行大概手动测量，注意设置浏览器缩放与显示器缩放为100%，否则可能会测量与设置不符；
1.3 设置字体粗细 font-weight
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one2{font-size: 25px;font-family: '微软雅黑';}.one{font-size: 25px;font-family: '微软雅黑';font-weight: bold;}</style>
</head>
<body><div class="one2">这是第一个div</div><div class="one">这是第一个div</div></body>
</html>运行后页面如下：
注：（1）字体粗细的设置，参考mdn文档，有：
截图链接：font-weight - CSS：层叠样式表 | MDN (mozilla.org)
（2）字体也可以通过设置字体粗细实现标题效果，html很多标签都可以通过cs实现；
1.4 设置字体倾斜 font-style
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one2{font-size: 25px;font-family: '微软雅黑';}.one{font-size: 25px;font-family: '微软雅黑';font-style: italic;}</style>
</head>
<body><div class="one2">这是第一个div</div><div class="one">这是第一个div</div>
</body>
</html>运行后页面如图：
2. 文本属性
2.1 设置文本颜色 color
计算机表示颜色方式：
（1）RGB：现实中很多颜色都是由红绿蓝三原色混合而成的，而计算机也可采用RGB三色调和表示颜色，计算机给RGB各分配一个字节，每个字节的范围时0~255（00~FF）
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{font-size: 25px;font-family: "微软雅黑";color:rgb(255,0,0);}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>如上文rgb(255,0,0)表示red分量设置为最大值，green、blue分量均设置为0；
注：当三各颜色分量均设置为255最大值时，将会呈现白色；
当三个颜色分量均设置为0时，将会呈现黑色；
（2）在前端中，每个分量都使用一个字节来表示，范围0~255或0~0xff，其中每两个十六进制数表示一各颜色分量，如：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>/* .one{font-size: 25px;font-family: "微软雅黑";color:rgb(255,0,0);} */.two{font-size: 25px;font-family: "微软雅黑";color:#ff0000;}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>表示红色分量设置为最大值，蓝色和绿色分量均设置为0，故而最终字体为红色；
注：16进制表示数字可以缩写，如果每个分量的两个十六进制数字都相同，就可以把6位16进制数字缩写成3位十六进制，如表示纯红色，既可以写为#f0000，也可以写为#f00；
（3）直接使用颜色单词表示，如red，blue，green等；
2.2 文本对齐 text-align
text-align属性可设置为left靠左对齐，center居中对齐，right靠右对齐等：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{font-size: 25px;font-family: "微软雅黑";color:rgb(255,0,0);text-align: center;}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>运行后页面如下：
2.3 文本装饰 text-decoration
常用取值为：
underline：下划线；
none：可用于给a标签去下划线；
overline：上划线；
line-through：删除线；
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>a{text-decoration: none;}</style>
</head>
<body><div><a href="#">链接1</a></div>
</body>
</html>运行后页面如下：
2.4 文本缩进 text-indent
text-indent有两种取值表示方式：
第一种：像素表示法，根据字体大小自行计算缩进值，如字体大小为20px，则缩进两格可以标识为：text-indent:20px;
但是这种方法不仅要自行根据字体大小计算缩进尺寸，并且当字体大小变化时，缩进尺寸还需另行计算并随之更改，表示绝对，故而并不常用；
第二种：em表示法，em是一个相对量，是以文字尺寸为基础来进行设置的，如果文字大小是25px，则1em=25px，2em=50px；
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{text-indent: 2em;}</style>
</head>
<body><div class="one">这是一个div</div><div>这是第二个div</div>
</body>
</html>运行后页面如图：
注：（1）文本缩进的取值可以为负数，负数表示往左缩进：
2.5 行高 line-height
HTML中展示文字涉及到以下基准线：
行高=文字高度+行间距；
如运行以下代码：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{font-size: 25px;font-family: "微软雅黑";color:rgb(255,0,0);text-align: left;text-decoration: line-through;text-indent: 2em;line-height: 45px;}</style>
</head>
<body><div class="one">这是一个div</div><div class="one">这是第二个div</div>
</body>
</html>运行后页面如图：
此时字体大小25px，行高45px，即行间距20px；
3. 背景属性
3.1 背景颜色 background-color
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{font-size:25px;color:brown;font-family:"微软雅黑";background-color:cadetblue;}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>运行后页面如图：
3.2 背景图片 background-image
通过background-image:url(图片名称)设置图片背景；
3.2.1 背景图片平铺设置：background-repeat
当引入背景图片后，默认情况下图片是平铺的，可以使用background-repeat:no-repeat来取消平铺，仅为单个照片，图片出现在左上角。
3.2.2 背景图片位置设置：background-position
设置方法1：
使用top、center、bottom等方位词设置图片位置，
如：background-position:center center令图片水平居中，垂直居中，
backgroun-position:top center令图片水平居中，垂直在上；
设置方法2：
使用像素进行左表设置图片位置；
注意计算机中的坐标系是原点在左上角，y轴正方向竖直向下，x轴正方向水平向右的左手坐标系；
3.2.3 背景图片大小：background-size
设置方法1：
像素设置：手动指定背景图片的长和高；
设置方法2：
contain：令图片尽可能大地展示，但图片须全图展示；
cover：令图片完全覆盖背景区域，背景图像的某些部分可能无法展示在背景定位区域中；
注：在background属性的加持下，任何一个元素都可以用来显示图片，而且提供的功能比image标签更强大；
4. 圆角矩形
HTML元素默认都是一个个矩形，但有时候需要表示带有圆角的矩形；
使用border-radius:进行像素设置来指定矩形角的内切圆半径值；
4.2 生成圆角矩形
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{width: 200px;height:100px;background-color: orange;color:#fff;text-align:center;line-height:100px;border-radius: 10px;/* 表示矩形角的内切圆半径为10px */}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>运行后页面如下：
注：当设置的内切圆半径为矩形高度的一半，就会有以下胶囊型形状：
4.3 生成圆形
当原矩形为正方形时，再将矩形角内切圆半径设置为边长的一半，就可以生成圆形：
<style>.one{width: 150px;height:150px;background-color: orange;color:#fff;text-align:center;line-height:150px;border-radius: 75px;/* 表示矩形角的内切圆半径为10px */}</style>运行后页面如下：
5. 元素的显示模式
5.1 块级元素 display:block
常见的块级元素有：
h1 - h6
p
div
ul
ol
li
...5.2 行内元素 display:inline
常见的行内元素有：
a
strong
b
em
i
del
s
ins
u
span
...5.3 块级元素和行内元素的区别
（1）块级元素独占一行，行内元素不独占一行；
（2）块级元素高度、宽度、内外边距都可以设置；
行内元素的高度、宽度、行、高均无效，内边距有效，外边距有时有效有时无效；
（3）块级元素默认宽度和父元素一样宽，行内元素默认宽度和连内容一样宽；
（一般将行内元素转成块级元素）
6. CSS盒子模型
任何一个HTML块级元素都是一个矩形盒子：
从内到外分别为：内容content、内边距padding、边框border、外边距margin；
通过设置这几内边距、边框、外边距这几个属性，就可以控制元素之间、元素和内容之间的相对位置了；
6.1 边框
（1）border属性直接设置了四个方向，
还可以使用border-left、border-right、border-top、border-bottom分别设置四个方向；
（2）设置边框要设置三个方面：
①、边框的粗细；
②、边框的颜色；
③、边框的风格（实线solid、虚线dashed、点线dotted...）；
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: center;line-height: 100px;border:5px chocolate solid;}</style>
</head>
<body><div class="one">这是一个div</div>
</body>
</html>运行后页面如下：
注：（2）width和height表示的是内容的尺寸，加上边框后，内容尺寸没有变化，但边框会撑大盒子；
（2）大多数情况下都不希望因为边框撑大盒子，因为会影响该元素与其他元素的相对位置，可以使用一些专用属性防止盒子被撑大：
<style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: center;line-height: 100px;border:5px chocolate solid;box-sizing: border-box;}</style>将box-sizing属性设置为border-box就可以避免边框撑大盒子，即该情况下的边框是向内增加边框；
6.2 内边距
内边距设置的是内容与边框之间的距离：
以文字左对齐为例，可以通过设置padding-left指定内容与边框的距离：
<style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: left;line-height: 100px;border:5px chocolate solid;box-sizing: border-box;padding-left: 10px;}</style>使用网页的开发者工具查看布局可以看出padding内边距被设置为10px：
注：（1）如果要设置四个方向的内边距，可以使用padding:npx进行设置；
（2）padding:10px 表示四个方向内边距均为10px；
padding:10px 20px 表示上下内边距是10px，左右内边距是20px；
padding:10px 20px 30px 40px 将上右下左（顺时针）四个内边距依次设置为10px，20px，30px，40px；
6.3 外边距
外边距设置的是元素和元素之间的距离；
试查看以下代码的运行页面：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: left;line-height: 100px;border:5px chocolate solid;box-sizing: border-box;padding-left: 10px;}.two{width:200px;height:100px;background-color:grey;}</style>
</head>
<body><div class="one">这是一个div</div><div class="two">这是第二个div</div>
</body>
</html>其运行页面如下：
可见，当没有设置外边距margin时，两个div之间没有间距，此时可以使用对第一个div元素下外边距设置5像素：
<style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: left;line-height: 100px;border:5px chocolate solid;box-sizing: border-box;padding-left: 10px;margin-bottom: 5px;}.two{width:200px;height:100px;background-color:grey;}</style>运行后页面如下：
注：（1）同理padding,margin也可以分别对上下左右进行设置；
（2）margin-left和margin-right可以设置为auto，即令浏览器自动调节，此时该元素就可以在父元素内部居中放置：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.one{width:200px;height:100px;background-color: orange;color:white;text-align: left;line-height: 100px;border:5px chocolate solid;box-sizing: border-box;/* padding-left: 10px; */margin-bottom: 5px;}.three{width:50px;height: 50px;background-color: brown;margin-left: auto;margin-right:auto;}</style>
</head>
<body><div class="one"><div class="three"></div></div>
</body>
</html>此时就可以实现元素的居中：
但是垂直方向设置为auto不能实现垂直反向的居中效果；
7. 弹性布局
弹性布局是用于实现页面布局的，即控制某个指定元素放到某个指定位置；
试运行以下代码：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div{width:100%;height:150px;background-color:darksalmon;}div>span{background-color:lightslategrey;width: 100px; /* 行内元素宽度设置无效 */}</style>
</head>
<body><div><span>1</span><span>2</span><span>3</span></div>
</body>
</html>运行后页面如下：
行内元素虽然是在水平上排列的，但由于其尺寸、边距等均不太可控，并不适合进行水平布局；
（行内块元素和行内元素一样，会把源码中的换行当做一个空格，也会对页面元素布局产生不必要的影响），使用弹性布局是更合适的；
7.1 开启弹性布局 display
开启弹性布局：display:flex; 给要水平排列的元素的父元素设置flex：
<style>div{width:100%;height:150px;background-color:darksalmon;display: flex;}div>span{background-color:lightslategrey;width: 100px; /* 行内元素宽度设置无效 */}</style>运行后页面如下：
此时弹性容器内的元素不再是“块级”“行内”元素，而成为弹性元素，遵守弹性布局，可以设置尺寸和边距了；
7.2 设置元素的水平排列方式 justify-content
justify-content:flex-start； 表示靠左排列；
justify-content:flex-end; 表示靠右排列；
justify-content:flex-center; 表示居中排列；
除此之外，还有可将justify-content设置为space-between，即每个元素左右两侧都有等间距空白，实线元素在水平方向的等间距排列；
7.3 设置元素的垂直排列方式 align-items
align-items:flex-start; 表示靠顶排列；
align-items:flex-end; 表示靠底排列；
align-items:center; 表示居中排列；
试运行以下代码：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div{width:100%;height:150px;background-color:darksalmon;display: flex;justify-content: flex-start;align-items: center;}div>span{background-color:lightslategrey;width: 100px;height:100px;}</style>
</head>
<body><div><span>1</span><span>2</span><span>3</span></div>
</body>
</html>运行后页面如图：
可见span1、2、3在水平方向实现了靠左排列，在垂直方向实现了居中排列；
相关文章：
【JavaEE】_CSS常用属性值
目录 1. 字体属性 1.1 设置字体家族 font-family 1.2 设置字体大小 font-size 1.3 设置字体粗细 font-weight 1.4 设置字体倾斜 font-style 2. 文本属性 2.1 设置文本颜色 color 2.2 文本对齐 text-align 2.3 文本装饰 text-decoration 2.4 文本缩进 text-indent 2.…...
vue组件库开发，webpack打包，发布npm
做一个像elment-ui一样的vue组件库 那多好啊！这是我前几年就想做的 但webpack真的太难用，也许是我功力不够 今天看到一个视频，早上6-13点，终于实现了，呜呜 感谢视频的分享-来龙去脉-大家可以看这个视频：htt…...
Java中快速排序的优化技巧：随机取样、三数取中和插入排序
目录 快速排序基础 优化1：随机取样 优化2：三数取中 优化3：插入排序 总结： 快速排序（Quick Sort）是一种高效的排序算法，它的平均时间复杂度为O(n log n)。然而，在某些情况下&…...
【leetcode 力扣刷题】删除字符串中的子串or字符以满足要求
删除字符串中的子串或者字符以满足题意要求 1234. 替换子串得到平衡字符串680. 验证回文串917. 仅仅反转字母 1234. 替换子串得到平衡字符串 题目链接：1234. 替换子串得到平衡字符串 题目内容： 题目中给出了平衡字符串的定义——只有’Q’，…...
【Unity基础】3.脚本控制物体运动天空盒
【Unity基础】3.脚本控制物体运动&天空盒 大家好，我是Lampard~~ 欢迎来到Unity基础系列博客，所学知识来自B站阿发老师~感谢 （一）搭建开发环境 （1）下载visual studio 在我们下载unity编译器的时候&…...
Spring MVC拦截器
拦截器（Interceptor）是 Spring MVC 提供的一种强大的功能组件。它可以对用户请求进行拦截，并在请求进入控制器（Controller）之前、控制器处理完请求后、甚至是渲染视图后，执行一些指定的操作。 在 Spring MV…...
ClickHouse的Join算法
ClickHouse的Join算法 ClickHouse是一款开源的列式分析型数据库（OLAP），专为需要超低延迟分析查询大量数据的场景而生。为了实现分析应用可能达到的最佳性能，分析型数据库（OLAP）通常将表组合在一起形成一个…...
java面试题-RabbitMQ面试题
RabbitMQ面试题 面试官：RabbitMQ-如何保证消息不丢失 候选人： 嗯！我们当时MYSQL和Redis的数据双写一致性就是采用RabbitMQ实现同步的，这里面就要求了消息的高可用性，我们要保证消息的不丢失。主要从三个层面考虑 第一…...
数据仓库-核心概念
数据仓库 数据仓库，英文名称为Data Warehouse，可简写为DW或DWH。数据仓库，是为企业所有级别的决策制定过程，提供所有类型数据支持的战略集合。它是单个数据存储，出于分析性报告和决策支持目的而创建。为需要业务智能的…...
java中的实体类
在Java与数据库交互时，设计实体类有以下几个原因： 1、对象关系映射（ORM）：实体类提供了一种将数据库中的表映射为Java对象的方式。这样，开发人员可以使用面向对象的方式操作数据库，而无需编写大…...
使用Puppeteer爬取地图上的用户评价和评论
导语 在互联网时代，获取用户的反馈和意见是非常重要的，它可以帮助我们了解用户的需求和喜好，提高我们的产品和服务质量。有时候，我们需要从地图上爬取用户对某些地点或商家的评价和评论，这样我们就可以分析用户对不同…...
GLSL ES着色器语言 使用矢量和矩阵的相关规范
目录 矢量和矩阵类型 下面是声明矢量和矩阵的例子： 赋值和构造 矢量构造函数 矩阵构造函数 构造矩阵的几种方式 访问元素 . 运算符 矢量的分量名 ［ ］运算符 运算符 矢量和矩阵可用的运算符 矢量和矩阵相关运算 矢量和浮点数的…...
Himall商城- web私有方法
目录 1 Himall商城- web私有方法 1.1 /// 获取售价 1.1.1 //商品批量销售价 1.1.2 //获取组合购的价格 Himall商城- web私有方法 #region web私有方法 /// <summary> /// 获取售价 /// <para>己计算会员折</para> /// </summary> /// <para…...
Spring Boot 整合 Redis，使用 RedisTemplate 客户端
文章目录 一、SpringBoot 整合 Redis1.1 整合 Redis 步骤1.1.1 添加依赖1.1.2 yml 配置文件1.1.3 Config 配置文件1.1.4 使用示例 1.2 RedisTemplate 概述1.2.1 RedisTemplate 简介1.2.2 RedisTemplate 功能 二、RedisTemplate API2.1 RedisTemplate 公共 API2.2 String 类型 A…...
Tomcat 接收请求并传递给工作线程池流程
文章目录 Tomcat 接收请求并传递给工作线程池流程接收 socket 连接 org.apache.tomcat.util.net.SocketProcessorBase#reset结论 Tomcat 接收请求并传递给工作线程池流程 接收 socket 连接 有两个线程 http-nio-8080-ClientPoller-0/1 （下文称为 clientPoller&…...
在Linux系统上用C++将主机名称转换为IPv4、IPv6地址
在Linux系统上用C将主机名称转换为IPv4、IPv6地址 功能 指定一个std::string类型的主机名称，函数解析主机名称为IP地址，含IPv4和IPv6，解析结果以std::vector<std::string>类型返回。解析出错或者解析失败抛出std::string类型的异常消…...
【硬件设计】硬件学习笔记二--电源电路设计
硬件学习笔记二--电源电路设计 一、LDO设计1.1 LDO原理1.2 LDO参数1.3 应用 二、DC-DC设计2.1 DC-DC原理2.2 DC-DC参数介绍2.4 DC-DC设计要点2.5 DC-DC设计注意事项 写在前面：本篇笔记来自王工的硬件工程师培训课程，想要学硬件的同学可以去腾讯课堂直接搜…...
day34 集合总结
集合总结 一、概述 作用：存储对象的容器，代替数组的，使用更加的便捷 所处的位置：java.util 体系结构 二、Collection 内部的每一个元素都得是引用数据类型 常用方法 add(Object o) 添加元素 addAll(Collection c) 将指定集…...
【JAVA】 图书管理系统(javaSE简易版 内含画图分析) | 期末大作业课程设计
作者主页：paper jie 的博客 本文作者：大家好，我是paper jie，感谢你阅读本文，欢迎一建三连哦。 本文录入于《JAVA》专栏，本专栏是针对于大学生，编程小白精心打造的。笔者用重金(时间和精力)打造&…...
区块链技术与应用 - 学习笔记3【比特币数据结构】
大家好，我是比特桃。本系列笔记只专注于探讨研究区块链技术原理，不做其他违反相关规定的讨论。 区块链技术已被纳入国家十四五规划，在“加快数字发展 建设数字中国”篇章中，区块链被列为“十四五”七大数字经济重点产业之一&#…...
Ubuntu下高效Vim的搭建(离线版)
软件界面 可以看到界面下方有一些常用提示信息：文件路径、format、文件类型、光标所在的坐标(x,y)、进度条(百分比)、日期时间 会提示已定义的变量名词(快速补全) 搭建方法 下载资源文件 把Vim 和 .vimrc 拷贝到家目录下，并执行tar -xvf Vim 即可。 …...
阿里云和腾讯云2核2G服务器价格和性能对比
2核2G云服务器可以选择阿里云服务器或腾讯云服务器，腾讯云轻量2核2G3M带宽服务器95元一年，阿里云轻量2核2G3M带宽优惠价108元一年，不只是轻量应用服务器，阿里云还可以选择ECS云服务器u1，腾讯云也可以选择CVM标准型S5云…...
PYTHON（一）——认识python、基础知识
一、为什么要学习python？ Python 被认为是人工智能、机器学习的首选语言，可以说是全世界最流行通用范围最广的语言，几乎可以完成所有的任务，像设计游戏、建网站、造机器人甚至人工智能等都广泛使用Python。 二、输出（…...
Python 操作 Excel
之前看过一篇文章，说一个工作多年的老员工，处理数据时只会用复制粘贴到 Excel ，天天加班工作还完不成，后来公司就招了一个会 Python 的新人，结果分分钟就处理完成。所以工作中大家经常会使用 Excel 去处理以及展示数据…...
21.添加websocket模块
这里默认读者了解websocket协议，若是还不了解可以看下这篇文章wesocket协议。 websocket主要有三个步骤，1通过HTTP进行握手连接，2进行双向通信，3.协商断开连接 第一步的握手连接需要HTTP，所以还需要使用到上一节讲解…...
Linux UDP编程流程
文章目录 UDP编程流程UDP协议无连接的特点UDP协议数据报的特点 UDP编程流程 UDP 提供的是无连接、不可靠的、数据报服务。服务器端和客户端没有什么本质上的区别。编程流程如下： socket()用来创建套接字，使用 udp 协议时，选择数据报服务 SOC…...
【opencv】多版本安装
安装opencv3.2.0以及对应的付费模块 一、安装多版本OpenCV如何切换 按照如下步骤安装的OpenCV，在CMakeLists.txt文件中，直接指定opencv的版本就可以找到相应版本的OpenCV，为了验证可以在CMakeLists.txt文件中使用如下指令输出版本验证&…...
webpack打包常用配置项
webpack打包配置项 参考链接 文件结构：最基础版 先安装 npm i webpack webpack-cli --dev 运行命令：npx webpack 进行打包 1. 配置webpack.config.js文件： const path require(path); module.exports {mode: development, // 开发环境 …...
回归预测 | MATLAB实现MPA-BiGRU海洋捕食者算法优化双向门控循环单元多输入单输出回归预测（多指标，多图）
回归预测 | MATLAB实现MPA-BiGRU海洋捕食者算法优化双向门控循环单元多输入单输出回归预测（多指标，多图） 目录 回归预测 | MATLAB实现MPA-BiGRU海洋捕食者算法优化双向门控循环单元多输入单输出回归预测（多指标，多图&a…...
selenium_webdriver自动化测试指南
目录 1 引言 4 1.1 目的.. 4 1.2 背景.. 4 1.3 参考资料.. 4 2 安装并引用Selenium2. 5...
domain 网站建设/创建网址快捷方式
转载于:https://www.cnblogs.com/LiLihongqiang/p/5721842.html...
佛山网站建设哪家便宜/怎样在百度打广告
前言 想要成為一名優秀的Android開發，你需要一份完備的 知識體系，在這裏，讓我們一起成長為自己所想的那樣。 金九银十是大家的換工作潮，在這波浪潮裡沉浮的我經歷過快一個月的面試後，決定把這些遇到的問題記下來 加…...
wordpress p 收录/国产十大erp软件
前言 投递的是后端开发，日常实习，产品研发与基础架构部，即负责技术中台的大部门，具体到给教育产品线做用户增长的小部门，主要运用go和python。 由于是我的一位HR实习的大四学姐帮我推的简历，面试全程都由…...
广东省住房城乡建设厅官方网站/做百度推广需要什么条件
为什么80%的码农都做不了架构师？>>> 原文地址:http://www.cnblogs.com/kingboy2008/archive/2011/07/01/2226424.html IE浏览器的兼容性一直是网站开发人员头疼的事情，众所周知，微软的Internet Explorer团队一直在致力于将IE8打造…...
西安官网优化报价/百度seo权重
我的游戏学习日志57———类型游戏策划（1.4）—动作游戏（4） (上接)1.动作游戏策划-设计元素： <9>惊喜 产生惊喜的方式：设置隐藏元素、跳关、额外奖励 ①隐藏元素：包括隐藏道具、隐藏关卡、…...
沈阳医疗网站建设/今天最新的新闻头条新闻
实 战环境介绍： 服务器名 IP 系统 MySQL odd.example.com 192.168.1.116 rhel-5.8 5.5.16 even.example.com 192.168.1.115 rhel-5.8 5.5.16 假设要同步的库是 db_rocky ㈠ 创建同步用户 在 ODD上 mysql grant replication slave on *.* to water192.168实战环境介绍…...