![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 54
德云Millie
这个作者很懒,什么都没留下…
展开
-
BS
Bootstrap框架基础及全局CSS样式1.使用BS方法 1)本地引入(必须先下载) a.引入bootstrap.css或bootstrap.min.css <link rel="stylesheet" type="text/css" href="css/bootstrap.css" /> b.引入JS(如果不使用插件,不需要引入JS)bootstrap.js或bootstrap.min.js。 注意:bootst原创 2021-05-10 13:47:18 · 290 阅读 · 0 评论 -
JSON
JSON JSON(JavaScript Object Notation:JS对象简谱)是一种轻量级的数据交换格式。 JSON是ECMA制定的一个数据表示规范,是ECMAScript的一个子集。采用独立于编程语言的文本格式来存储和表示数据。 表示数据结构清晰、简洁、易于阅读和解析。 逐渐取代了XML数据格式。 它实际上就是一个对象或数组,或对象中含有数组,或数组中含有对象。2.JSON的表示方式1)对象表示 var obj = {原创 2021-03-31 14:52:45 · 96 阅读 · 0 评论 -
ajax请求操作步骤
1.Ajax1)什么是Ajax? ajax(Asynchronous Javascript And Xml:异步的JavaScript和XML),目的是让JavaScript发送http请求, 与后台通信,获取数据和信息。 Ajax技术的原理是实例化xmlhttp对象,使用此对象与后台通信。在通信过程中不会影响后续的JS的执行,从而实现异步操作。2)同步和异步 同步就是做完一件事(任务)后再做另一件事,后一件的执行依赖于前一件事件的完成。同原创 2021-03-31 14:48:16 · 219 阅读 · 0 评论 -
尺寸
尺寸1)获取和设置元素的尺寸 $(dom).width()/height() 获取元素的宽度/高度 $(dom).innerWidth()/innerHeight() 获取包括padding的宽度/高度 $(dom).outerWidth()/outerHeight() 获取包括padding和border的宽度/高度 $(dom).outerWidth(tr原创 2021-03-31 14:41:58 · 72 阅读 · 0 评论 -
导航栏:navbar
导航栏:navbar导航栏容器可以包含以下几个常用组成:1、品牌LOGO(.navbar-brand )navbar-brand默认是放文字的,也可以放图片,但必须是小图片,如果图片太大,位置就会靠下.2、导航菜单(.navbar-nav).navbar——设置nav元素为导航条组件;.navbar-default——指定导航条组件为默认主题;.navbar-inverse——指定导航条组件为黑色主题;.navbar-fixed-top——设置导航条组件固定在顶部;.navbar-fixe原创 2021-03-31 14:40:54 · 3767 阅读 · 0 评论 -
DOM
DOM节点的名称节点类型 nodeName元素节点的 标签名相同属性节点的 属性名相同文本节点的 #text文档节点的 #document节点的值节点类型 nodeValue元素节点的 是 undefifined 或 null文本节点的 文本本身属性节点的 属性值节点的类型元素类型 nodeType元素 1属性 2文本 3注释 8文档 9节点操作a)获取节点通过ID获取节点 【返回具体某个节点】原创 2021-03-31 14:36:48 · 55 阅读 · 0 评论 -
JavaScript
JavaScript1、基本数据类型:数字,字符串,布尔值,未定义值和空值。2、引用数据类型:对象(数组也属于对象的一种)原创 2021-03-30 21:24:46 · 52 阅读 · 0 评论 -
选择器
选择器1)基本选择器 id: #id class: .class element: element * 选择所有标签(项目开发时,不要用,因为它要匹配完所有的标签,性能差) , 选择多个DOM2)层次选择器 选择器1 选择器2:选择选择器1的所有的后代元素(选择器2) 选择器1>选择器2:只选择选择器1的子元素 选择器1+选择器2:选择紧挨着选择器原创 2021-03-30 21:23:36 · 95 阅读 · 0 评论 -
使用JQuery
使用JQuery1)本地引入<script src="./js/jquery-3.3.1.min.js"></script> 2)CDN引入 <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.0/jquery.js"></script>`` **注意:JQ必须先引入,然后才能调它的API。可以在head标签中引入,也可以在最后引入,一般在最后引入。**...原创 2021-03-30 21:23:14 · 52 阅读 · 0 评论 -
事件
事件 click() 鼠标单击 mouseover() 鼠标进入(进入子元素也触发) mouseout() 鼠标离开(离开子元素也触发) mouseenter() 鼠标进入(进入子元素不触发) mouseleave() 鼠标离开(离开子元素不触发) keydown() 按下键盘键 keyup() 松开键盘键 keypress() 从键盘输入字符 focus() 元素获得焦点 blur() 元素失原创 2021-03-30 21:10:56 · 76 阅读 · 0 评论 -
对象
1、对象定义 a)new构建 new Object(); b)字面量定义 var obj={ key:value,//属性 fn:function(){ //方法 ……}}2、对象引用 a)对象名.属性名 对象名.方法名(【实参列表】)b)对象名【属性名】//当属性名为一个变量时,只能用【】去取值,且不能加引号,因为他是变量 对象名【方法名】3、定义数组:a、使用 Array 构造函数创建:var arr01 = new原创 2021-03-30 21:09:04 · 58 阅读 · 0 评论 -
which和if区别
switch与if区别: switch一般用于获取结果的简单条件的判断,而if一般用于复杂的条件判断; if能实现的条件判断,switch不一定能实现,switch能实现的条件判断,if也一定能;原创 2021-03-30 21:03:42 · 780 阅读 · 0 评论 -
浮动
1.什么是浮动1.什么是浮动 浮动就是让块级标签不独占一行。目的(使用场景):把块级标签元素可以排在一行上2、浮动的原理 就是让元素脱离文档流,不占用标准3、浮动后,不管是后面的块级元素还是行级元素不会显示在下一行4、清除浮动 目的:让后面的元素自动掉到下一行 方法: 1)添加空标签,并设置样式:clear:both; clear:left 清除左浮动 clear:right 清除右浮动 clear:both 清除左右浮动 clea原创 2021-03-30 21:00:47 · 55 阅读 · 0 评论 -
displayblock详解
display:block详解1、每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级”元素(block-level);而span元素的默认display属性值为“inline”,称为“行内”元素。**2、块级元素:占据一定矩形空间,可以通过设置高度、宽度、内外边距等属性,来调整的这个矩形; 行内元素 :自己的独立空间,它是依附于其他块级元素存在的,因此,对行内元素设置高度、宽度、内外边距等属性,都是无效的。3、例子:链接 a 元原创 2021-03-30 20:57:25 · 3312 阅读 · 0 评论 -
font复合属性、css背景、样式权重
css字体1、font复合属性: font:font-style(文字样式normal,italic,oblique) font-variant(大写字母变小) font-weight(加粗) font-size /line-height(大小/行高) font-family(字体)2、css背景 1)background-color:背景色(transparent/color) 2) background-image:背景图(none/url) 3) background-r原创 2021-03-30 20:45:59 · 706 阅读 · 0 评论 -
CSS 子元素选择器
CSS 子元素选择器1、css子元素选择器如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用子元素选择器(Child selector)。例如,如果您希望选择只作为 h1 元素子元素的 strong 元素,可以这样写:h1 > strong {color:red;}这个规则会把第一个 h1 下面的两个 strong 元素变为红色,但是第二个 h1 中的 strong 不受影响:2、css兄弟选择器如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可原创 2021-03-30 20:44:04 · 7929 阅读 · 0 评论 -
ps精灵图
ps精灵图1PS是用来处理位图的,而AI是用来处理矢量图的。2.位图和矢量图 位图是由像素点组成的,文件较大,放大会失真,一般用来表示人物、风景等;矢量图是由线条组成的,文件较小,放大后不会失真,一般用来表示工程图等,是由若干个几何图形拼合而成。3.分辨率 又叫解析度、解像度。可分为显示分辨率、图像分辨率、打印分辨率和扫描分辨率等。 图像分辨率就是单位英寸中所包含的像素点数。分辨率越高意味着图像越清晰,但这个图像文件也越大。4.位分辨率 又叫色彩深度或位深度,批一个像素中,每个颜色分原创 2021-03-28 18:47:27 · 399 阅读 · 0 评论 -
分栏和flex弹性布局、响应式布局、媒体查询、图标字体
1.多列(分栏) 1)column-count 规定元素应该被分隔的列数(栏数)。 column-count: number|auto; 2)column-gap 设置栏间距。 column-gap: length|normal; 3)column-rule 设置栏间分隔线。 a)column-rule-style:设置线型。 none 没有分隔线 hidden 隐藏线原创 2021-03-28 18:42:39 · 322 阅读 · 0 评论 -
transition:过渡动画
transition:过渡动画1)常规用法: transition-property transition-duration transition-timing-function transition-delay 2)简洁(复合)用法: transition: property-name-list|all duration timing-function delay;a)可以使用的属性有:原创 2021-03-28 15:21:02 · 112 阅读 · 0 评论 -
2D和3D变换
2D和3D变换rotate(angle)方法通过 rotate() 方法,元素顺时针旋转给定的角度。允许负值,元素将逆时针旋转。/值 rotate(30deg) 把元素顺时针旋转 30 度。/transform: rotate(30deg);translate(x,y)方法通过 translate() 方法,元素从其当前位置移动,根据给定的 left(x 坐标) 和 top(y 坐标) 位置参数。/值 translate(50px,100px) 把元素从左侧移动 50 像素,从原创 2021-03-28 15:18:19 · 166 阅读 · 0 评论 -
css3
css31.CSS3不是属于浏览器或同一浏览器的不同版本都支持,所以需要兼容处理,通常的做法就是加厂商前缀。 1)主流浏览器内核(面试点) a)Trident: IE内核 b)Webkit:Chrome和Safari内核 c)Gecko:FireFox内核 d)Blink(是Webkit的一个分支): Chrome和Opera内核 Tips(技巧): 目前国内的浏览器大多都是双核的(IE内核+Chro原创 2021-03-28 15:14:39 · 63 阅读 · 0 评论 -
HTML5
HTML51、HTML5多媒体(1)audio: 播放音乐或音频。IE9以下的版本不支持a:支持的格式:.MP3/.ogg/.wavb:属性 src:文件路径autoplay:自动播放controls:控制条muted:静音preload:预加载(当使用autoplay时,preload自动失效)(2)video视频a: 属性:src:文件路径autoplay:自动播放loop:循环controls:控制条muted:静音preload:预加载(当使用autoplay时,pr原创 2021-03-28 14:53:18 · 68 阅读 · 0 评论