- 博客(63)
- 收藏
- 关注
RSS订阅原创 flex_布局_总结
父容器属性<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docum...
2020-04-21 00:16:40
214
原创 idea解决跨域问题
跨域什么叫跨域什么是跨域(摘要网络)要了解跨域，先要说说同源策略。同源策略是由 Netscape 公司提出的一个著名的安全策略，所有支持 JavaScript 的浏览器都会使用这个策略。所谓同源是指，域名，协议，端口相同。当页面在执行一个脚本时会检查访问的资源是否同源，如果非同源，那么在请求数据时，浏览器会在控制台中报一个异常，提示拒绝访问。同源策略一般又分为以下两种：DOM同源策略：禁...
2020-04-16 19:28:17
5535
1
原创 Jquery用Ajax请求数据_(直接覆盖的方式在table中插入数据_和追加到元素后面的方式插入数据);
1_Ajax_ajax请求数据的步骤用ajax向服务器请求数据大致分为5步;分别为(请求方式_请求地址_给服务器需要的参数_服务器返回的数据类型_判断是否拿到正确的数据);<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v...
2020-04-15 00:38:28
1196
原创 鼠标贪吃蛇效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<...
2020-04-06 01:56:25
299
原创 JS 解决冒泡事件
冒泡事件冒泡事件就是说它会一层一层的传递上去,比如说:你给div和它的子元素同时添加了 点击事件,那么你点击子元素作为它的父元素的div的点击也会同时触发,解决这种问题的方法如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta nam...
2020-04-06 00:27:09
937
原创 JS任意值的运动框架
任意值的运动框架包括宽,高,字体大小,边框.<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &...
2020-04-04 23:29:29
124
原创 缓冲运动以及(向上取整和向下取整)
向上取整:Math.ceil向下取整:Math.floor<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g...
2020-04-03 21:41:07
193
原创 JS 侧边栏慢入慢出
参数的应用,让我们少写了很多代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit...
2020-04-03 21:07:19
166
原创 js_子节点与父节点
子节点_children<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&g...
2020-04-02 21:44:38
451
原创 JS无缝滚动
无缝滚动最主要的是注意几个鼠标事件和时间事件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &...
2020-04-02 20:44:55
113
原创 offsetLeft_获取物体的左间距(获取非行间的样式)
不止有offsetLeft,还有offsetTop,和offsetHeight,offsetWidth;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width...
2020-04-02 01:07:51
262
原创 延时提示框
延时提示框,注释了的是细致版本.没注释的精简版本. Document 头像 详细资料<script> var div1 = document.getElementById('div1'); var div2 = document.getElementById('div2'); var timer ...
2020-04-02 00:45:24
99
原创 智能时钟
智能时钟,需要自己找图片:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&...
2020-04-02 00:12:01
304
1
原创 Jquery学习类容1_下载Jquery
1.Jquery安装1.在百度上搜索jquery打开官网2.在官网中点击下载3.打开调试工具(按F12)找到一下几点4.点击右键,找到Save as…保存下来.(我保存的名字为jquery.js)5.找到保存文件,并在已有的web项目中，新建文件夹Jquery，并把jquery-3.3.1.min.js复制到该文件夹下。6.引入该文件,第一个是引入的jquery.js文件.第...
2020-03-31 01:01:14
125
原创 JavaScript_函数的声明写法和表达式写法
JavaScript_函数的声明写法声明写法声明写法用function声明一个函数,在用函数名直接调用就可以了!表达式写法表达式写法又分为命名表达式和匿名表达式;命名表达式:相当于我们直接把test1赋值给了abc.调用的时候我们就可以用abc来进行调用;匿名表达式匿名表达式和命名表达式不同的地方就是没有名字,同样是用cba();调用;...
2020-03-30 23:22:08
303
原创 visual studio需要用到的一些插件
1.安装Visual studio我一般是在360软件管理上面搜索安装的，在上面可以精准的找到我们要安装的软件，简单快捷。2.一些好用的插件安装好了visual studio我们还需要一些插件和设置来帮助我们进行高效的开发1.设置1.ctrl + shift + p 就可以弹弹出搜索框，然后在里面找到我们要设置的相关内容，（主题，语言，切换自动换行）；2.设置细节1.颜色主题：...
2020-03-25 19:27:44
1481
原创 css的单位(px,em.rem,%,)
css的单位换算以及相对的位置1.px单位.(像素)px是你屏幕设备物理上能显示出的最小的一个点，这个点不是固定宽度的，不同设备上点的长宽、比例有可能会不同。假设：你现在用的显示器上1px宽=1毫米，但我用的显示器1px宽=两毫米，那么你定义一个div宽度为100px，你显示器上看这个div是10厘米，我显示器上看是20厘米。另外一个px点的长宽不一定是1:1的正方形，有的设备上长宽比是不...
2020-02-21 21:00:04
813
原创 超出部分省略号的形式进行显示
一.文本显示省略号文本类容一般都是全部显示的,而在有些情况下我们需要让他不显示出来,例如要做出这种情况我只需要三段代码就可以实现了, 具体来看一下代码: <style> .box{ height: 100px; width: 100px; background-color: #f00;...
2020-02-19 21:15:19
223
原创 帧动的使用animation(动画)
帧东的使用:帧动的意思是在一个操作中可以让画面可以移动多个帧.让画面实现多动画效果帧动,让一个图片移动到另一个位置.这叫一帧,然后在移动到另外一个位置,那么一共就移动了两帧.要想让图片实现帧动效果用transform:translate(100px);和transition:transfom 1s ease;再配合hover等等事件就可以实现,具体代码: <style>...
2020-02-19 17:56:14
287
原创 css 网络字体的使用
网络字体网络字体意思是除了系统自带的字体之外的特殊字体.1.网络字体他先是根据你给的地址,先下载到浏览器,然后在应用.2.字体的格式分别有:ttf,otf,eot,sog,svgz,woff,等等,这些格式有些浏览器是不支持的,所以我3.们添加字体的时候需要多添加几种字体,以便适配更多的浏览器.应用代码: <style> @font-face { ...
2020-02-19 15:32:27
1015
原创 flex布局items:flex-grow;(放大items)和flex-shrink(收缩)
1.flex-growflex-gorw决定了items如何扩展1.flex-gorw可以设置任意的分非负数的小数,包括正小数,正整数,和0,他的默认值为02.当container的宽度大于items的总和时,fleix-gorw才会生效.但是不会超过container的总宽度.3.如果所有的items设置的flex-gorw属性值都超过1或等于1那么itmes会扩展到和container...
2020-02-18 20:23:11
377
原创 flex布局items:align-self;
align-selfalign-self是设置单个items的对齐方式的align-self可以单独给items设置对齐方式,他对齐的是container的交叉轴具体代码: <style> .test{ height: 400px; width: 400px; background-c...
2020-02-18 19:45:53
969
原创 flex布局items:order(设置items本身的排列顺序)
orderorder是设置在items里面的属性,具体作用是可以决定本身的排列先后顺序,比如我们可以用order属性设置第二个排列在第一个.也可以设置第三个排列在第二个.具体代码如下: <style> .test{ height: 400px; width: 400px; backgr...
2020-02-18 18:24:43
10106
原创 flex布局items
flex布局idems元素diems是container的子元素，他会默认继承父元素的flex效果，也就是说只要父元素开启了flex布局那么他就会默认按照flex布局的排列方式进行排列： <style> .test{ height: 400px; width: 400px; backgro...
2020-02-18 17:31:09
416
原创 flex布局container:flex-wrap,align-contend(换行显示以及操作多行之间的间隙)
:flex-wrap:flex-wrap用于多行显示:idems默认是在container中同一行显示,如果空间不够,那么他会把idems进行压缩.(缩小)想要解决这个问题我们就需要用到:flex-wrap属性,: <style> .test{ height: 400px; width: 400px; ...
2020-02-18 17:13:39
1252
原创 flex布局container:align-items属性
align-itensalign-items是决定idems在交叉轴上的对齐方式 <style> .test{ height: 400px; width: 400px; background-color: #f00; /* 开启flex布局 */ ...
2020-02-18 16:27:46
323
原创 flex布局container:justify-content属性
flex布局container:justify-content属性;justify-content:justify-content是决定idems在主轴的对齐方式 .test{ height: 400px; width: 400px; background-color: #f00; ...
2020-02-18 15:55:07
505
原创 flex布局container元素:flex-direction属性
flex布局*## flex布局好处:flex布局可以更细致的控制每个元素，使其更简介，快速,完整的实现布局。flex布局的元素felx有两个元素,分别为container和idems。containercontainer元素为父元素,用于包裹idems元素,开启flex布局有两种方式。方式一:给container元素添加**display:felx;意思是开启flex布局但是co...
2020-02-18 15:22:00
600
原创 flex_idems属性的basis
<style> .box{ height: 300px; width: 500px; background-color: #f3f; margin: 0 auto; } .xiaobox1,.xiaobox2,.xiaobox3{ ...
2020-02-17 22:29:18
131
1
原创 flex-idems属性的shrink
<style> .box{ height: 300px; width: 500px; background-color: #f3f; margin: 0 auto; } .xiaobox1,.xiaobox2,.xiaobox3{ ...
2020-02-17 22:27:56
92
原创 flex-idems属性的_grow
<style> .box{ height: 300px; width: 650px; background-color: #f3f; margin: 0 auto; } .xiaobox1,.xiaobox2,.xiaobox3{ ...
2020-02-17 22:26:46
108
原创 flex_idems属性的_align-diesms
<style> .box{ height: 300px; width: 650px; background-color: #f3f; margin: 0 auto; } .xiaobox1,.xiaobox2,.xiaobox3{ ...
2020-02-17 22:25:36
100
原创 flex_idems属性的order
<style> div{ height: 300px; width: 650px; background-color: #f3f; margin: 0 auto; } .box...
2020-02-17 22:19:48
117
原创 flex_container
`<style> div{ height: 300px; width: 650px; background-color: #f3f; margin: 0 auto; } .box1,.box2,.box3{ height: 100px; width: 100px; } .box1{ backgroun...
2020-02-17 22:17:14
585
原创 html5_多媒体元素
<style> video{ width: 1000px; } </style></head><body> <!-- controls:增加控制工具栏 autoplay:自动播放,但是存在兼容问题 muted:静音,增加后自动播放才会有效果 loop:循环播放...
2020-02-17 21:17:58
323
原创 html5新添加的语意化标签
<body> <header>头部元素</header> <nav>导航元素</nav> <section>定义文档某个区域的元素 <article>类容元素</article> </section> <aside>侧边栏...
2020-02-17 21:16:30
164
原创 实现图片居中
<style> .box{ /* 隐藏超出部分 */ overflow: hidden; min-height: 800px; } .box img{ /*相对定位 */ position: relative; ...
2020-02-17 21:10:07
261
原创 @ComponentScan自动导入和指定导入
import Test_01.Test02;import Test_01.Test_03;import Test_02.Test_05;（这里要特别注意包是否导进来）import org.springframework.context.annotation.AnnotationConfigApplicationContext;/** * Created by XiaoBai on 2...
2019-09-26 23:46:56
1168
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人