当前位置：首页 > news >正文

【前端】CSS（引入方式+选择器+常用元素属性+盒模型+弹性布局）

news 文章来源：https://blog.csdn.net/m0_64003319/article/details/137358635 2024/10/27 4:32:42

文章目录

CSS
- 一、什么是CSS
- 二、语法规范
- 三、引入方式
- - - - 1.内部样式表
      - 2.行内样式表
      - 3.外部样式
- 四、选择器
- - 1.选择器的种类
  - - 1.基础选择器：单个选择器构成的
    - - 1.标签选择器
        2.类选择器
        3.id 选择器
        4.通配符选择器
    - 2.复合选择器
    - - 1.后代选择器
        2.子选择器
        3.并集选择器
        4.伪类选择器
- 五、常用元素属性
- - 1.字体属性
  - - - 1.设置字体
        2.设置大小
        3.设置粗细
        4.文字样式
  - 2.文本属性
  - - - RBG
        1.文本颜色
        2.文本对齐
        3.文本缩进
        4.文本装饰
        5.行高
  - 3.背景属性
  - - - 1.背景颜色
        2.背景图片
        3.背景平铺
        4.背景位置
        5.背景尺寸
  - 4.圆角矩形
  - - - 生成圆形
        生成圆角矩形
- 六、元素的显示模式
- - - 1.块级元素
    - 2.行内元素
    - 3.行内元素和块级元素的区别
    - 4.改变显示模式
- 七、盒模型
- - - 1.边框
    - - 边框会把盒子撑大
    - 2.内边距
    - 3.外边距
    - 4.块级元素水平居中
    - 5.去除浏览器默认样式
- 八、弹性布局
- - - 1.flex布局的概念
    - 2.常用属性
    - - 1.justify-content
      - 2.align-items

CSS

一、什么是CSS

层叠样式表（Cascading Style Sheets）
对元素位置的排版进行精确控制，实现结构和样式的分离

CSS 控制页面的展示效果

HTML决定页面的结构

二、语法规范

选择器+{一条/N条声明}

选择器：要修改谁
声明:具体要修改什么内容。声明的属性是键值对，用分号区分，键和值用：

通常情况下，把style放在head中

<style>p{color: #23b47f;/* font-size: 50px; */  }
</style>

这里注释和html不一样

三、引入方式

1.内部样式表

通过style标签将CSS嵌套到HTML页面中
style 一般放在 head 中

可以让样式和页面结构分离，但是当CSS内容多的时候，分离的不够彻底

<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
<style>p{color: #23b47f;font-size: 50px;}
</style>
</head>

2.行内样式表

    <h3 style=" color: blueviolet; font-size: 30px;">行内样式表</h3>

只针对某个标签生效
适合简易的样式
优先级高，会覆盖掉其他的样式

3.外部样式

创建一个CSS文件
使用Link标签引如CSS

    <link rel="stylesheet" href="./demo02.css">

样式和结构彻底分离

受浏览器缓存影响，修改后不一定立即生效

ctrl+f5强制刷新页面

四、选择器

选中页面中要指定的标签元素
先选中才能设置

1.选择器的种类

1.基础选择器：单个选择器构成的

1.标签选择器

p{/* 标签选择器 */color: red;font-size: 40px;
}

2.类选择器

    <p class="html">hello html</p><p class="java">hello Java</p><p class="html">hello Python</p><p class="java">hello eat</p>.java{color:chartreuse;font-size: 30px;
}
.html{color:blueviolet;font-size: 50px;
}
.longurage{font-size: 70px;
}<p class="html longurage">hello Python</p>

类名用 . 开头的

类选择器可以进行样式的叠加，因此两个类名用空格隔开

3.id 选择器

    <p id="fe">前端开发</p><p id="server">后端开发</p>
#fe{color:red;font-size: 80px;
}
#server{color: blue;font-size: 120px;
}

同一个页面，id的值为一
id后加#

4.通配符选择器

*选取所有的标签
消除所有元素的默认样式。主要消除边距

* {background-color:antiquewhite;
}

2.复合选择器

把多种基础选择器综合运用起来

1.后代选择器

包含选择器，选择父类中的子元素

元素1 元素2 {样式声明}ol li{color: red;}ul li{color: aqua; }.hobby li{color: red;}

元素 1 和元素 2 要使用空格分割

元素 1 是父级, 元素 2 是子级, 只选元素 2 , 不影响元素 1

元素 2 不一定非是儿子, 也可以是孙子

2.子选择器

.two>a {color: red;
}

只能选择亲儿子
使用大于号分割

3.并集选择器

用于选择多组标签. (集体声明)
逗号分割

div, h3 {color: red;
}

4.伪类选择器

用来定义元素的状态

1.链接伪类选择器

 a:link 选择未被访问过的链接a:visited 选择已经被访问过的链接a:hover 选择鼠标指针悬停上的链接a:active 选择活动链接(鼠标按下了但是未弹起)
a:link {color: black;/* 去掉 a 标签的下划线 */text-decoration: none;
}
a:visited {color: green;
}
a:hover {color: red;
}
a:active {color: blue;
}

清空浏览器历史记录: ctrl + shift + delete
按照 LVHA 的顺序书写,把 active 拿到前面去, 就会导致 active 失效

2 :force 伪类选择器

选取获取焦点的 input 表单元素.

<div class="three"><input type="text"><input type="text"><input type="text"><input type="text">
</div>
.three>input:focus {color: red;
}

被选中的表单的字体就会变成红色

五、常用元素属性

1.字体属性

1.设置字体

font-family

    <style>.font-family .one {font-family: 'Microsoft YaHei';}.font-family .two {font-family: '宋体';}</style>
++++++++++++++++++++++++++++++++++++++<div class="font-family"><div class="one">这是微软雅黑</div><div class="two">这是宋体</div></div>

2.设置大小

font-size

    p {font-size: 100px;}

chrome 默认大小是 16px
可以给 body 标签使用 font-size
标题标签需要单独指定大小
实际上它设置的是字体中字符框的高度；实际的字符字形可能比这些框高或矮

3.设置粗细

    .font-family .two {font-family: '宋体';font-size: 30px;font-weight: bold;}

700 == bold, 400 是不变粗, == normal
取值范围是 100 ~ 900

4.文字样式

        /* 设置倾斜 */font-style: italic;/* 取消倾斜 */font-style :normal;.font-style em {font-style: normal;}<div class="font-style"><em>倾斜的</em><div class="one">正常的</div></div>

经常需要把倾斜的改正常

2.文本属性

RBG

R (red), G (green), B (blue) 的方式表示颜色(色光三原色)
每个颜色用一个字节表示
一个字节8个比特位, 表示的范围是 0-255, 十六进制表示为 00-FF
255, 255, 255 表示白色; 0, 0, 0 就表示黑色

1.文本颜色

color: red;
color: #ff0000;
color: rgb(255, 0, 0);

2.文本对齐

控制文字水平方向上的对齐
lorem 生成一长段文字

<style>h1 {text-align: left;}h2 {text-align: center;}h3 {text-align: right;}
</style>

3.文本缩进

控制段落的首行缩进 (其他行不影响)
单位可以使用 px 或者 em.使用 em 更好,1 个 em 就是当前元素的文字大小.
缩进可以是负的, 表示往左缩进. (会导致文字就冒出)

    p {text-indent: 2em;/* text-indent: 20px; */}

4.文本装饰

underline 下划线. [常用]
none 啥都没有. 可以给 a 标签去掉下划线. 
overline 上划线. [不常用]
line-through 删除线 [不常用]p {text-indent: 2em;/* text-indent: -20px; */text-decoration: underline;}

   a {text-decoration: none;}<a href="#">不跳转</a>

5.行高

上下文本行之间的基线距离

    p {text-indent: 2em;/* text-indent: -20px; */text-decoration: underline;line-height: 30px;}

行高 = 上边距 + 下边距 + 字体大小

3.背景属性

1.背景颜色

默认是 transparent (透明) 的. 可以通过设置颜色的方式修改

    body {background-color:blanchedalmond;}

2.背景图片

比 image 更方便控制位置(图片在盒子中的位置)

    div {width: 500px;height: 700px;background-image: url(https://n.sinaimg.cn/spider20240403/541/w889h452/20240403/16f6-1605b48ddfd6cbf9f6f5f4e8e052308f.jpg);}

url 上可以加引号, 也可以不加

3.背景平铺

repeat: 平铺
no-repeat: 不平铺
repeat-x: 水平平铺
repeat-y: 垂直平铺

默认是repeat

背景颜色和背景图片可以同时存在. 背景图片在背景颜色的上方

    div {width: 700px;height: 400px;background-image: url(../image/男.png);background-repeat: no-repeat;}

4.背景位置

    div {width: 700px;height: 400px;/* background-image: url(https://n.sinaimg.cn/spider20240403/541/w889h452/20240403/16f6-1605b48ddfd6cbf9f6f5f4e8e052308f.jpg); */background-image: url(../image/男.png);background-repeat: repeat-y;background-position: 200px 200px; /*对背景图片的位置进行移动*/}

参数的三种风格:

方位名词: (top, left, right, bottom)
精确单位: 坐标或者百分比(以左上角为原点)
混合单位: 同时包含方位名词和精确单位

两个参数都是方位名词, 则前后顺序无关. (top left 和 left top 等效)
只有一个名词，第二个默认居中（left水平居中）
参数是精确值：第一个是x,第二个是y
参数是精确值：只有一个，是x是值，另一个默认居中
混合单位，第一个是x的，第二个为y

计算机中的平面坐标系, 一般是左手坐标系(y轴向下)

5.背景尺寸

		background-size: 700px 400px;background-size: 80%;background-size: cover;background-size: contain;

填写具体的值
填百分比
cover: 扩展至足够大,图像完全覆盖背景区域.超出范围（溢出盒子）
contion:扩展至完全适应内容区域的最大尺寸（被盒子框住）

4.圆角矩形

通过 border-radius 使边框带圆角效果

    div {width: 400px;height: 200px;border: 2px green solid; /*solid显示线条  */border-radius: 20px;}

length 是内切圆的半径. 数值越大, 弧线越强烈

生成圆形

让 border-radius 的值为正方形宽度的一半

    div {width: 400px;height: 400px;border: 2px green solid; /*solid显示线条  */border-radius: 50%;}

生成圆角矩形

border-radius 的值为矩形高度的一半

    div {width: 400px;height: 200px;border: 2px green solid; /*solid显示线条  */border-radius: 100px;}

还可以，针对四个角分别设置

border-radius:2em;                             
等价于                                              
border-top-left-radius:2em;
border-top-right-radius:2em;
border-bottom-right-radius:2em;
border-bottom-left-radius:2em;border-radius: 10px 20px 30px 40px;
等价于
border-top-left-radius:10px;
border-top-right-radius:20px;
border-bottom-right-radius:30px;
border-bottom-left-radius:40px;

六、元素的显示模式

1.块级元素

h1 - h6
p
div
ul
ol
li

独占一行
高度, 宽度, 内外边距, 行高都可以控制
和父元素一样宽
是一个容器(盒子), 里面可以放行内和块级元素

<style>.demo1 .parent {width: 500px;height: 500px;background-color: green;}.demo1 .child {/* 不写 width, 默认和父元素一样宽 *//* 不写 height, 默认为 0 (看不到了) */height: 200px;background-color: red;}
</style>
<div class="demo1"><div class="parent"><div class="child">child1</div><div class="child">child2</div></div>
</div>

文字类的元素内不能使用块级元素

p 标签主要用于存放文字, 内部不能放块级元素, 尤其是div

2.行内元素

a
strong
b
em
i
del
s
ins
u
span

不独占一行, 一行可以显示多个
无法设置高度, 宽度, 行高
默认宽度就是本身的内容
行内元素只能容纳文本和其他行内元素, 不能放块级元素
行内元素的宽度和高度会根据其内容进行改变

3.行内元素和块级元素的区别

1.块级元素独占一行, 行内元素不独占一行

2.块级元素可以设置宽高, 行内元素不能设置宽高

3.块级元素四个方向都能设置内外边距, 行内元素垂直方向不能设置.

4.改变显示模式

使用 display 属性可以修改元素的显示模式
可以把 div 等变成行内元素, 也可以把 a , span 等变成块级元素

display: block 改成块级元素 [常用]
display: inline 改成行内元素 [很少用]
display: inline-block 改成行内块元素a{display: block;}<a href="#">test1</a><a href="#">test2</a

七、盒模型

每一个 HTML 元素就相当于是一个矩形的 “盒子”

边框 border
内容 content
内边距 padding
外边距 margin

1.边框

粗细: border-width样式: border-style, 默认没边框. solid 实线边框 dashed 虚线边框 dotted 点线边框颜色: border-color

    div{width: 200px;height: 100px;border-color: black;border-style: solid;border-width: 10px;}简写： border: black solid 10px;

边框会把盒子撑大

通过 box-sizing 属性可以修改浏览器的行为, 使边框不再撑大盒子

    div{width: 200px;height: 100px;border-color: black;border-style: solid;border-width: 10px;box-sizing: border-box;}
* {box-sizing: border-box;
}

2.内边距

padding 设置内容和边框之间的距离
默认内容是顶着边框来放置的. 用 padding 来控制这个距离

        padding-left: 5px;padding-top: 5px;padding-right: 5px;padding-bottom: 5px;简写： padding: 5px;
还有按照顺时针写四个px

3.外边距

控制盒子和盒子之间的距离

    div{border: solid green 5px;/* margin-top: 5px;margin-bottom: 5px;margin-left: 5px;margin-right: 5px; *//* margin: 5px; */margin: 5px 5px 6px 6px;}

4.块级元素水平居中

前提：指定宽度(如果不指定宽度, 默认和父元素一致)
把水平 margin 设为 auto

    div{border: solid green 5px; width: 200px;height: 100px;margin: auto;/* 居中的是盒子，调整的是外边框 */text-align: center;}

margin-left: auto; margin-right: auto;
margin: auto;
margin: 0 auto;

三种写法都可以

对于垂直居中, 不能使用 "上下 margin 为 auto " 的方式

5.去除浏览器默认样式

    * {margin: 0px;padding: 0px;}

八、弹性布局

1.flex布局的概念

flex 是 flexible box 的缩写（弹性盒子）
任何一个 html 元素, 都可以指定为 display:flex 完成弹性布局
本质是给父盒子添加 display:flex 属性, 来控制子盒子的位置和排列方式
当父元素设置为 display: flex 之后, 子元素的 float, clear, vertical-align 都会失效

    div {height: 700px;width: 700px;background-color: green;display: flex;/*定义在直接的父级元素上 加上后不再是行内元素，大小为自己设置的宽高 */}

flex container :被设置display:flex属性的元素
flex item: 子元素成为这个容器的成员。可以纵向排列或者横向排列
flex direction(主轴)：控制排列方向

2.常用属性

1.justify-content

设置主轴上的子元素排列方式

        justify-content:flex-end;/* 项目位于容器的结尾 */justify-self: start;/* start是默认情况，默认在容器的开头 */平分剩余空间justify-content: space-between;/* 项目在行与行直接有间隙 */justify-content: space-around;/* 在项目的行之前，行之后，行之间留上空间 */

2.align-items

设置侧轴上的元素排列方式
align-items 只能针对单行元素来实现. 如果有多行元素, 就需要使用 item-contents

        align-items: stretch;align-items:start;align-items:end;align-items: center;align-items: space-around;align-items: space-between;

stretch(拉伸)是 align-content 的默认值

如果子元素没有被显示指定高度，就会填充父元素的高度

点击移步博客主页，欢迎光临~

偷cyk的图

【前端】CSS（引入方式+选择器+常用元素属性+盒模型+弹性布局）

文章目录 CSS一、什么是CSS二、语法规范三、引入方式1.内部样式表2.行内样式表3.外部样式四、选择器1.选择器的种类1.基础选择器：单个选择器构成的1.标签选择器2.类选择器3.id 选择器4.通配符选择器 2.复合选择器1.后代选择器2.子选择器3.并集选择器4.伪类选择器五…...

编程日记 2024/4/7 17:22:04

迷茫下是自我提升

长夜漫漫，无心睡眠。心中所想，心中所感，忧愁当前，就执笔而下，写下这篇文章。回忆过往回想当初为啥学前端，走前端这条路，学校要求嘛，兴趣爱好嘛，还是为了钱。时间带着…...

编程日记 2024/4/7 17:20:02

用vscode仿制小米官网

html内容: <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title><link rel&quo…...

编程日记 2024/4/7 17:16:59

【Java+Springboot】------ 通过JDBC+GetMapping方法进行数据select查询、多种方式传参、最简单的基本示例!

一、JDBC如何使用、PostGresql数据库 1、在pom.xml 先引用jdbc组件。 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-jdbc</artifactId></dependency> 2、在pom.xml 再引用p…...

编程日记 2024/4/7 17:15:58

基于单片机光伏太阳能跟踪系统设计

**单片机设计介绍，基于单片机光伏太阳能跟踪系统设计文章目录一概要二、功能设计三、软件设计原理图五、程序六、文章目录一概要基于单片机光伏太阳能跟踪系统的设计，旨在通过单片机技术实现对光伏太阳能设备的自动跟踪，以提高太阳…...

编程日记 2024/4/7 17:14:56

Stable Diffusion 本地化部署

一、前言最近在家背八股文背诵得快吐了，烦闷的时候，看到使用 AI 进行作图，可以使用本地话部署。刚好自己家里的电脑，之前买来玩暗黑4，配置相对来说来可以，就拿来试试。此篇是按照 Github 上的 stable-d…...

编程日记 2024/4/7 17:11:54

C++ Algorithm 常用算法

C <algorithm> 头文件是标准库中提供的一系列算法，用于操作范围（range）内的元素。这些算法可以用于数组、容器如vector和list，以及其他满足相应迭代器要求的数据结构。以下是一些常用的C <algorithm> 中的算法及其使用…...

编程日记 2024/4/7 17:09:51

线程安全--深入探究线程等待机制和死锁问题

꒵˂͈꒱ write in front ꒰˃͈꒵˂͈꒱ ʕ̯•͡˔•̯᷅ʔ大家好，我是xiaoxie.希望你看完之后,有不足之处请多多谅解，让我们一起共同进步૮₍❀ᴗ͈ . ᴗ͈ აxiaoxieʕ̯•͡˔•̯᷅ʔ—CSDN博客本文由xiaoxieʕ̯•͡˔•̯᷅ʔ 原创 CSDN 如需转…...

编程日记 2024/4/7 17:08:50

量子计算获重大突破！微软和Quantinuum将量子计算错误率降低800倍，网友：AI算力的希望

量子计算迎来新突破。近日，微软和量子计算公司Quantinuum宣布：发现了一种新的量子计算系统，可以将传统量子计算的错误率下降800倍，这让高性能量子计算机走进现实更近了一步。自生成式AI爆发以来，算力是AI发展面临的…...

编程日记 2024/4/7 17:01:43

WordPress 6.5 “里贾纳”已经发布

WordPress 6.5 “里贾纳”已经发布，其灵感来自著名爵士小提琴家Regina Carter的多才多艺。雷吉娜是一位屡获殊荣的艺术家和著名的爵士乐教育家，以超越流派而闻名，她在古典音乐方面的技术基础和对爵士乐的深刻理解为她赢得了大胆超越小提琴所能…...

编程日记 2024/4/7 17:00:42

甲方安全建设之日志采集实操干货

前言没有永远的安全，如何在被攻击的情况下，快速响应和快速溯源分析攻击动作是个重要的话题。想要分析攻击者做了什么、怎么攻击进来的、还攻击了谁，那么日志是必不可少的一项，因此我们需要尽可能采集多的日志来进行分析攻击者的…...

编程日记 2024/4/7 16:58:39

dm8 开启归档模式 1 命令行 [dmdbatest1 dm8]$ disql sysdba/Dameng123localhost:5237服务器[localhost:5237]:处于普通打开状态登录使用时间 : 3.198(ms) disql V8 SQL> select name,status$,arch_mode from v$database;行号 NAME STATUS$ ARCH_MODE ----------…...

编程日记 2024/4/7 16:55:36

“AI复活”背后的数字永生：被期待成为下一个电商，培育市场认知和用户心智还需时间

编程日记 2024/4/7 16:54:34

基于单片机钢琴电子节拍器系统设计

**单片机设计介绍，基于单片机钢琴电子节拍器系统设计文章目录一概要二、功能设计三、软件设计原理图五、程序六、文章目录一概要基于单片机钢琴电子节拍器系统设计是一个综合性的项目，它结合了单片机编程、音频处理、用户界面设计等多个领域的…...

编程日记 2024/4/7 16:52:32

我的创作纪念日（year Ⅱ）

大家好，我是Kamen Black 君，今天我与大家简单分享一下我两年来在CSDN的创作历程。 print("祝大家每天快乐，love and peace！") 机缘当初写博客是为了记录一些自己大学中做比赛的心得，没想到自己能走到这一步…...

编程日记 2024/4/7 16:49:29

应急响应实战笔记05Linux实战篇（1）

第1篇：SSH暴力破解 0x00 前言 SSH 是目前较可靠，专为远程登录会话和其他网络服务提供安全性的协议，主要用于给远程登录会话数据进行加密，保证数据传输的安全。SSH口令长度太短或者复杂度不够，如仅包含数字&#x…...

编程日记 2024/4/7 16:48:28

重装系统之后，电脑连网卡都没反应怎么办？

前言有些电脑比较奇葩，安装完成之后会出现网卡连驱动都没有，这时候要安装电脑驱动可是真的烦躁。怎么下手呢？ 如果确定电脑的网卡型号还好，直接找个电脑下载个对应的网卡驱动，用U盘复制过去就能安装。但如果不知道…...

编程日记 2024/4/7 16:47:26

【三十五】【算法分析与设计】综合练习（2），22。括号生成，77。组合，494。目标和，模拟树递归，临时变量自动维护树定义，递归回溯，非树结构模拟树

22. 括号生成数字 n 代表生成括号的对数，请你设计一个函数，用于能够生成所有可能的并且有效的括号组合。示例 1： 输入：n 3 输出：["（（（））&#xff0…...

编程日记 2024/4/7 16:46:25

QT智能指针

一.概述 Qt智能指针是一种能够在不需要手动管理内存的情况下，自动释放资源的指针。它们是C11的std::shared_ptr的一种扩展，可以用于管理Qt对象，尤其是那些不是QObject的对象。使用智能指针可以避免内存泄露和悬垂指针等问题，同时…...

编程日记 2024/4/7 16:45:24

C++笔记之pkg-config详解，以及g++、gcc编译时使用pkg-config

C++笔记之pkg-config详解，以及g++、gcc编译时使用pkg-config —— 2024-04-05 code review 文章目录 C++笔记之pkg-config详解，以及g++、gcc编译时使用pkg-config1.pkg-config详解`pkg-config` 的基本用法在 `g++`/`gcc` 编译时使用 `pkg-config`注意事项2.示例C++，普通编译…...

编程日记 2024/4/7 16:41:20

[Apple Vision Pro]开源项目 Beautiful Things App Template

1. 技术框架概述： - Beautiful Things App Template是一个为visionOS设计的免费开源软件（FOSS），用于展示3D模型画廊。 2. 定位： - 该模板作为Beautiful Things网站的延伸，旨在为Apple Vision Pro用户…...

编程日记 2024/4/7 16:39:17

Qt Remote Objects (QtRO) 笔记

简介 Qt Remote Objects (QtRO) 是 Qt 的一个进程间通信模块。术语 Source 是指提供服务或提供功能供其他程序使用的对象，是 RPC 中的被调用端。 Replica 是指 Source 对象的代理对象，用于 RPC 中的调用端，对 Replica 的调用请求将被转发…...

编程日记 2024/4/7 16:35:13

Unity类银河恶魔城学习记录12-6.5 p128.5 Create item by Craft源代码

此章节在原视频缺失，此过程为根据源代码推断而来，并非原视频步骤 Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释，可供学习Alex教程的人参考此代码仅为较上一P有所改变的代码【Unity教程】从0编程制作类银河恶魔城游戏_哔哩…...

编程日记 2024/4/7 16:31:08

UE4_如果快速做出毛玻璃效果_假景深

UE4_如果快速做出毛玻璃效果_假景深 2022-08-20 15:02 一个SpiralBlur-SceneTexture材质节点完成效果，启用半透明材质通过修改BlurAmount数值大小调整效果spiralBlur-SceneTexture custom节点，HLSL语言float3 CurColor 0;float2 BaseUV MaterialFloa…...

编程日记 2024/4/7 16:30:07

c# wpf LiveCharts 绑定简单试验

1.概要 c# wpf LiveCharts 绑定简单试验 2.代码 <Window x:Class"WpfApp3.Window2"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d"http://schem…...

编程日记 2024/4/7 16:29:05

【Kafka】Kafka安装、配置、使用

【Kafka】安装Kafka 1. 安装Kafka2. Kafka使用2.0 集群分发脚本xsync(重要)2.0.1 scp命令2.0.2 rsync远程同步工具2.0.3 写一个集群分发脚本xsync (Shell 脚本) 2.1 Zookeeper安装2.2 对Kafka进行分发2.2.1 执行同步脚本2.2.2 三台云主机配置Kafka环境变量 1. 安装Kafka Kafka…...

编程日记 2024/4/7 16:25:00

2024HW--＞Wireshark攻击流量分析

在HW中，最离不开的，肯定是看监控了，那么就要去了解一些wireshark的基础用法以及攻击的流量！！！！ 1.Wireshark的基本用法比如人家面试官给你一段流量包，你要会用 1.分组详情对于我…...

编程日记 2024/4/7 16:22:58

Lafida多目数据集实测

Lafida 数据集 paper：J. Imaging | Free Full-Text | LaFiDa—A Laserscanner Multi-Fisheye Camera Dataset 官网数据：https://www.ipf.kit.edu/english/projekt_cv_szenen.php 官网：KIT-IPF-Software and Datasets - LaFiDa 标定数据下载&…...

编程日记 2024/4/7 16:15:49

excel wps中编码格式转换

EXCEL报表：另存为CSV格式，转换成UTF-8编码 - 简书 (jianshu.com) 经验证管用...

编程日记 2024/4/7 16:14:48

【游戏分析】非游戏领空追字符串来源

通过NPC名称找NPC数组扫描 NPC名字 ASIC型发现全部都有后缀那么采用字节集的方式去扫描也是扫不到说明:不是ASIC型字符串扫描 NPC名字 Unicode型没有结果那么转换成字节集去扫描终于发现结果了把结果挨个修改字符串发现其中两个是可以用的 22和23 …...

编程日记 2024/4/7 16:13:45

网站做好了后期怎么做/网站seo关键词

在创建枚举类时，编译器会默认给你继承Enum类。然而Enum类并没有values方法。通过反射可以了解到values是由编译器添加的public class Reflection {public static Setanalyze(Class> enumClazz) {System.out.println("分析" enumClazz "类"…...

编程日记 2024/10/27 2:35:00

手机搭建wordpress 不root/四川seo关键词工具

1 简介众所周知（你不知也当你知），MongoDB是以文档（Document）组织数据的。除了常用于存储Json数据，它也是可以存储普通文件的。我们可以把一些文件以BSOON的格式存入MongoDB，十分方便&#xff…...

编程日记 2024/10/27 0:17:23

临沂做网站推广的公司有/惠州百度seo

一、需求有这样一个需求，需要将用户上传的Excel中链接的文件上传到服务器，用户会保证Excel中内容按照模板上传，第一列是省份，第二列是省份对应的上传的文件，比如下面的例子： 第二列就是链接的用户本地文件…...

编程日记 2024/10/27 0:12:19

网站开发实验报告/郑州网络推广平台有哪些

为什么80%的码农都做不了架构师？>>> 之前讲过虚拟机中的堆，他是整个内存模型中占用最大的一部分，而且不是连续的。当有需要分配内存的时候，一般有两个方法分配，指针碰撞和空闲列表。该部分的内存回收是由虚…...

编程日记 2024/10/26 23:28:54

高新园区规划建设局网站/网店推广方式

给apache安装php扩展： sudo apt-get install libapache2-mod-php 注：这是apache解析php文件的关键，光修改配置文件不安装扩展是不起作用的。目录位置：/etc/apache2/apache2.conf<Directory /home/menco/workplace># Rew…...

编程日记 2024/10/26 22:19:02

南京做网站咨询南京乐识/百度推广收费

每人自己建立一个HelloWorld项目，练习使用git的add/commit/push/pull/fetch/clone等基本命令。比较项目的新旧版本的差别。 1、首先创建一个Hello-World的项目。 2、在本地创建一个HelloWorld.java的文件。 3、打开Git Bash。进行git的add/commit/push/pull/fetch/c…...

编程日记 2024/10/26 22:11:56