- 博客(45)
- 收藏
- 关注
RSS订阅原创 字符串
1.字符串本质String对象是 JavaScript 原生提供的三个包装对象之一，用来生成字符串对象。String对象也是JS内置对象中使用频率最高的之一。 2.创建字符串 (1) 字面量(基本数据类型) var str1 = 'hello'; console.log(typeof(str1));//'hello' string (2) 构造函数(引用数据(对象...
2019-08-14 10:28:05
174
原创 运算符
运算符 赋值运算符 = 算术运算符 + , - , * , / , % 比较(关系)运算符 > , < , >= , <= , == , === , != , !== 逻辑运算符 && ， ll ， ！ 三元(条件)运算符 条件 ？ 表达式1 ： 表达式2 自增自减运算符 num++ ， ++num ， num-- , --num...
2019-08-12 08:54:49
196
原创 数组
1.数组(Array) : 就是一组数据的集合 存储在单个变量下的优雅方式 (1).利用new 创建数组 var arr = new Array();//创建了一个空的数组 (2).利用数组字面量创建数组[] var arr = [];//创建了一个空的数组 var arr1 = [1, 2, ...
2019-08-12 08:54:18
177
原创 流程控制语句
流程控制1.if的语法结构 如果ifif (条件表达式) {执行语句}执行思路：如果if里面的表达式为真 true 则执行大括号里面的 执行语句如果if里面的表达式为假 false 则不执行括号里面的语句 则执行if 语句后面的代码if (3<5) {alert(‘李高文’);} //当3>5时，不执行{}里面的语句 当3<5时，执行{}里面的语句 ...
2019-08-12 08:53:47
138
原创 循环
循环的目的：可以重复执行某些代码主要有3种类型的循环语句(1).for循环(2).while循环(3).do…while循环在程序中，一组被重复执行的语句被称之为循环体，能否继续重复执行 ，取决于循环的终止条件。由循环体及循环的终止条件组成的语句，被称之为循环语句 1. for 重复执行某段代码 ，通常跟计数有关系 2. for 语法结构 for (初始化变量; 条...
2019-08-12 08:52:59
281
原创 数据类型
1.数据类型：（1）数据类型的不同表示所占存储空间的不同（2）js的变量数据类型是只有程序在运行过程中，根据等号右边的值来确定的 （3）js拥有动态语言 变量的数据类型是可以变化的（4）js数字类型既可以用来保存整数值，也可以保存小数（浮点数）–number 2.五种基础数据类型 （1）number：数字（var num = 10; var PI = 3.14;//PI数字...
2019-08-12 08:52:18
199
原创 函数作用域
1. javaScript作用域 ： 就是代码名字（变量） 在某个范围内起作用和效果 目的是为了提高程序的可靠性更重要的是减少命名冲突 2. js的作用域（es6）之前：全局作用域 局部作用域 3. 全局作用域： 整个script标签 或者是一个单独的js文件 var num = 10; var num = 30; console.log(num);...
2019-08-12 08:51:14
133
原创 变量
输入框:prompt(‘请输入你的年龄’)var myname = prompt(“请输入您的名字”); 弹出警示框:alert('计算的结果是?') alert(myname); 控制台输出 给程序员测试用的console.log('我是程序员能看到的'); 1.声明一个age的变量 var age; 2.赋值 把值存入这个变量中 age = ...
2019-08-12 08:49:57
185
原创 函数
1.函数概念就是封装了一段可以被重复执行的代码块 目的：就是让大量代码重复使用 2.函数分为 声明函数 和 调用函数 （1）.声明函数 function 函数名(){ //函数体 } function sayHi() { console.log('hi~~~'); ...
2019-08-12 08:49:03
128
原创 多列布局 CSS3新增的background的属性
1.多列布局多列属性： 将内容设置成像报纸一样的感觉内容column-count 规定元素被分隔的列数 属性值：number (不能和column-width同时使用)column-gap 规定多列之间的间隔 属性值：lengthcolumn-rule 规定多列布局列与列的边框 属性值：宽度 样式 颜色column-rule-width 边框宽度column-rule-style 边框...
2019-08-05 08:38:46
183
原创 2D transform方法 3D转换 css3动画
2D Transform 方法 函数 描述matrix(n,n,n,n,n,n) 定义 2D 转换，使用六个值的矩阵。translate(x,y) 定义 2D 转换，沿着 X 和 Y 轴移动元素。translateX(n) 定义 2D 转换，沿着 X 轴移动元素。translateY(n) 定义 2D 转换，沿着 Y 轴移动元素。scale(x,y) 定义 2D 缩放转换，改变元素的宽...
2019-08-05 08:37:57
300
原创 移动端布局
viewport(视口)许多智能手机都使用了一个比实际屏幕尺寸大很多的虚拟可视区域，主要目的就是让pc页面在智能手机端阅读时不会因为实际可视区域变形。所以你看到的页面还是普通样式，即一个全局缩小后的页面。为了让智能手机能根据媒体查询匹配对应样式，让页面在智能手机中正常显示，特意添加了一个meta标签。这个标签的主要作用就是让智能手机浏览页面时能进行优化，并且可以自定义界面可视区域的尺寸和缩放级别...
2019-08-05 08:31:26
171
原创 响应式页面
响应式：Html:meatv + enter键快速生产视口含义为：宽为手机移动设备默认宽度，初始缩放比例为1.0，最大缩放比例为原始像素大小，不允许用户放大或者缩小;在css底部写响应式样式或者用外部文件引入：媒体类型引用方法：1、link方式2、media：引入条件添加媒体查询的样式没有添加媒体查询的样式之间的优先级也是根据书写顺序规定的页面样式用弹性盒和像素写响应式条...
2019-08-05 08:30:24
217
原创 渐变 css3 过渡
渐变线性渐变background-image: linear-gradient(direction, color-stop1, color-stop2, …);线性渐变direction取值(此参数可省略)：angle：通过角度来确定渐变的方向，0度表示渐变方向从下向上，90度表示渐变方向从左向右。如果取值为负值，其角度按逆时针方向旋转。关键词：通过关键词来确定渐变的...
2019-08-05 08:28:19
218
原创 rem
rem1.rem是什么?rem(font size of the root element)是指相对于根元素的字体大小的单位2.为什么web app要使用rem？实现强大的屏幕适配布局(淘宝,腾讯,网易等网站都是rem布局适配)rem能等比例适配所有屏幕,根据变化html的字体大小来控制rem的大小,...
2019-07-28 21:39:47
1132
原创 响应式 媒体查询
媒体查询media Query( ['kwɪərɪ])viewport(视口)许多智能手机都使用了一个比实际屏幕尺寸大很多的虚拟可视区域，主要目的就是让pc页面在智能手机端阅读时不会因为实际可视区域变形。所以你看到的页面还是普通样式，即一个全局缩小后的页面。为了让智能手机能根据媒体查询匹配对应样式，让页面在智能手机中正常显示，特意添加了一个meta标签。这个标签的主要作用就是让智能手机浏览页面...
2019-07-28 21:38:55
273
原创 弹性盒模型
弹性盒一、box-sizingbox-sizing:此属性用来指定元素的宽度与高度的计算方法二、css3弹性盒css3引入一种新的布局模式——Flexible Box布局，即伸缩布局盒模型（弹性盒布局），用来提供一个更有效的方式制定、调整和分布一个容器里的项目布局，即使他们的大小是未知或者动态的。...
2019-07-28 21:35:35
249
原创 兄弟选择器 border-radius 圆角属性 各浏览器厂商对border-radius的子属性解析
兄弟选择器向后选不向前选相邻兄弟选择器E+F{属性：属性值;} 选中E元素的相邻的兄弟元素FE和F是同级元素，并且是相邻的兄弟元素，在结构中F必须写在E的后面，选择符中E和F通过加号+连接通用兄弟选择器E~F{属性：属性值; 选中E元素的兄弟元素FE和F是同级元素，并且F写在E的后面，选择符中E和F通过波浪号~连接*/ #box .li2+p{ba...
2019-07-25 17:12:32
136
原创 text-shadow 设置文字阴影 background-size 设置背景图的大小 css3中对伪元素选择符做的改变
在css3中对伪元素选择符做的改变1.将之前的一个冒号：改变成两个冒号：：，但是使用一个冒号：依然可以2.给 ::before 和 ::after 的content属性添加了 url() 和 attr() 的属性值<style> #box::before{content: url(../img/1.jpg);} #box::after{content: attr(en...
2019-07-25 17:11:08
362
原创 浏览器私有前缀 目标伪类选择器 属性选择器
浏览器私有前缀 目标伪类选择器 :target{属性：属性值;} 适用于target元素（将元素id名写在a标签的href属性的属性值--锚点链接），当超链接被点击的时候，跳转到对应元素位置，target元素设置的样式显示 使用该选择器来对页面中的某个target元素（该元素的id当做页面中的超链接的属性值）指定样式，该样式只在用户点击了页面中的超链接，并且跳...
2019-07-25 17:08:51
184
原创 结构伪类选择器
1.结构伪类选择器E:empty{属性：属性值;}选中E元素中内容为空的E元素,最终只会选择到E元素，不会选择到其他元素 :root{属性：属性值;} 选择到根元素，在html中根元素就是html元素，所以 :root{属性：属性值;} ==== html{属性：属性值;} */ ul li{height: 40px;} ul div{height: 40px;} ...
2019-07-25 17:06:45
159
原创 否定伪类选择符 盒子阴影 渐进增强和优雅降级
1.否定伪类选择符E :not(F){属性：属性值;}选中E元素中除了F元素以外的其他元素F可以是元素选择符，也可以是类选择符，还可以id选择符<style> #box :not(p){color: pink;} #box :not(.aaa){background: blue;} #box :not(div){font-size: 40px;} <...
2019-07-25 17:04:44
140
原创 ul元素状态伪类选择器 处理文本换行
1.ul元素状态伪类选择器E:focus 用于指定元素获得光标焦点时所使用的样式，主要是在文本框空间获得焦点并进行文字输入时使用的样式； E:disabled 设置该元素处于不可用状态的样式; E:enabled 设置该元素处于可用状态时的样式； E:read-only 指定当元素处于只读状态时的样式 E:read-write 指定当元素处于非只...
2019-07-25 08:50:37
415
原创 mark 高亮显示 一般使用在搜索匹配关键字的时候使用
mark 高亮显示 一般使用在搜索匹配关键字的时候使用<mark>奋斗</mark> ruby 为中文注音或者注释 rt 为中文的注音或者货值 rp 当浏览器不支持此标签的时候，可以提示用户的语<ruby> 饕<rt>tao</rt> 餮<rt>tie</rt&g...
2019-07-23 20:59:36
232
原创 audio 定义音频标签
audio 定义音频标签 支持三种格式的音频文件 wav mp3 oggsrc=“引入音频文件的路径”autoplay=“autoplay” 自动播放，谷歌浏览器不支持muted=“muted” 静音controls=“controls” 显示播放控件，如果开始，暂停，声音调节，全屏等loop=“loop” 循环播放preload=“preload...
2019-07-23 20:58:11
422
原创 video 定义视频标签
video 定义视频标签支持三种格式的视频文件 webm mp4 oggsrc=“引入视频文件的路径”autoplay=“autoplay” 自动播放，谷歌浏览器不支持 配合muted属性可以自动播放，但是没有声音muted=“muted” 静音width="?px" 定义播放器的宽度height="?px" 定义播放器的高度control...
2019-07-23 20:57:40
279
原创 html推荐写法
推荐写法 语法的宽松不是好事，只会带来混乱，推荐遵循以下书写规则 1、包含可选的html、head、body元素 有助于将页面内容与其他页面信息分离 2、双标记书写结束标记 3、标签全部小写 输入轻松，不会让人触目惊心 4、为属性加引号 没有引号的话，一个无效字符就会破坏整个页面 /* 老的浏览器可能不...
2019-07-23 20:57:03
220
原创 html5的语法特点
html5的语法特点 一）、基本骨架更简单 二）、语法更宽松 1、元素可以省略结束标签 （1）空元素可省略结束反斜杠的元素：br、hr、img、input、link、mate （2）可以省略结束标签的元素：colgroup、dt、dd、li、optgroup、p、thead、tbody、tfoot、tr、td、th （3）可以全部省略标签的元...
2019-07-23 20:55:56
1051
原创 表单控件的属性
表单控件的属性required 为空不允许提交，可以用在大多数可以输入的元素上input[text, search, url, telephone, email, password, date pickers, number, checkbox, radio, file]placeholder 输入提示pattern 对输入域的内容左格式验证 属性值是正则表达式autofo...
2019-07-23 20:54:14
206
原创 语义化的重要性
语义化的重要性1，去掉或者丢失样式的时候能够让页面呈现出清晰的结构2，搜索引擎优化：搜索引擎能够更好的理解你的站点，搜索者查询的内容就容易与你的内容匹配，因而你的网站列在搜索结果中的可能性就越大；3，无障碍性，方便其它设备解析（如屏幕阅读器、盲人阅读器、移动设备）渲染网页，让任何人都能无障碍的访问页面；4，便于团队开发和维护，语义化更具可读性，是下一步网页的重要动向，遵循W3C标准的团队都...
2019-07-23 18:48:59
310
原创 表单、表格、flash、iframe、设置关键词、设置网页描述
表单由于浏览器的开发厂商不同，表单空间在不同的浏览器的样式有差异，但是功能是一样的 fieldset 表单字段集标签 块级 对表单内的表单控件进行分组 legend 表单字段集标题标签 必须要写在fieldset元素的内的第一个子元素 type="radio" 单选按钮 name="" value="" 同一组单选按钮的name名要书写一样，对应...
2019-07-23 08:49:18
169
原创 css bug cursor 设置属性形状
1.css bug 在div,dl,li等块元素中插入图片，会使元素的高度增加3-5px css hack1: 给图片的父元素添加font-size:0 都有效，li标签在ietester中未测试到结果 css hack2: 给图片转换成块级元素 display:block; 都有效，li标签在ietester中未测试到结果 css hack3: 将div与img书...
2019-07-22 10:38:52
124
原创 过滤器 设置最小（最大）高度和宽度 清除浮动的方法 伪类选择符 元素高度自适应窗口高度
1.过滤器：下划线属性过滤器语法：选择符{_属性：属性值；}支持情况：ie6及以下版本浏览器能识别 关键字属性过滤器 !important 语法：选择符{属性：属性值!impottant;} 支持情况：ie6及以下版本浏览器不能识别 说明：在高版本浏览器中，如果一个选择符中的写了多个同样的样式，具有关键字过滤器的样式优先级别高 *号属性过利器 语法：选择...
2019-07-19 08:46:32
408
原创 position设置定位属性 absolute绝对定位 fixed固定定位 relative相对定位 sticky粘性定位 z-index设置定位元素的层叠顺序 锚点链接 透明
1.position 设置定位属性static 默认值，没有定位，静态定位，相对没有属性position属性的元素都是static定位2.absolute 绝对定位会使元素脱离文档流，不需要去解决绝对定位会产生一个块级框，不管之前是何种元素，都可以设置宽高包含块：根据距离其最近的具有定位设置的父元素进行位置的偏移， 静态定位除外，如果所有的父元...
2019-07-17 18:42:08
752
原创 元素类型分类 块状元素 内联元素 盒模型通过display转变样式 置换元素/替换元素
一、元素类型分类块状元素，内联元素二、块状元素1）块级元素在网页中就是以块的形式显示，所谓块状就是元素显示为矩形区域，常用的块级元素包含:div p dl ol ul dt dd form fieldset h1-h6 hr table tr td colgroup col address (地址) blockquote (块引用) center (居中对齐) dir (目录列表)2）...
2019-07-16 22:23:25
314
原创 overflow属性 white-space属性 文本溢出 英文单词转换方式
1.overflow属性：overflow 设置溢出元素的内容如何显示 溢出的元素的内容是不会占据额外的空间visible 默认值 内容会显示在元素框之外，不会被修剪hidden 溢出隐藏 溢出元素框之外的内容会被修剪，被修剪的内容会隐藏不可见scroll 显示分动条 溢出元素框之外的内容会被修剪，会显示滚动条以便查看溢出内...
2019-07-16 22:18:43
453
原创 文本相关属性 列表相关属性 盒模型
1.文本相关属性text-indent 设置 首行缩进 属性值： length(数值+单位)em单位 1em=当前的文字大小（？px） 相对单位2.列表属性list-style-position:li圆点的位置（inside）3.盒模型content 内容区 由width和height设定的区域padding 内边距b...
2019-07-16 22:13:42
162
原创 浮动 ，高度塌陷的解决方法 ，边框
1.浮动：float默认值：none 没有浮动left:左浮动 right右浮动2.高度塌陷的解决方法（万能清除法）：选择符（高度塌陷的元素）：after{content:"." ;display:block;height:0;clear:both;overflow:hidden;visibility:hidden;}3.边框...
2019-07-16 10:53:45
155
原创 选择符的权重
1、选择符的权重css中用四位数字表示权重，权重的表达方式如：0，0，0，0（元素）类型选择符的权重为 0001伪元素选择符的权重为 0001class选择符的权重为 0010属性选择符的权重为 0010伪类选择符的权重为 0010id选择符的权重为 0100内联样式的权重为 1000通配符的权重为 ...
2019-07-13 20:22:33
804
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人