SF
前端技术文章
前端技术文章
注册登录
关注博客
注册登录
主页
关于
RSS
day34 gulp
shasha
2021-02-25
阅读 4 分钟
1.2k
gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器;她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成;使用她,我们不仅可以很愉快的编写代码,而且大大提高我们的工作效率。
day 32 jQuery插件
shasha
2021-02-25
阅读 3 分钟
1k
jQuery.extend(): Merge the contents of two or more objects together into the first object.(把两个或者更多的对象合并到第一个文档中);
day 33 NodeJS
shasha
2021-02-25
阅读 8 分钟
937
故名思义:他的运行环境就是浏览器,但是真的是这样的吗?其实不然,他的真正运行环境其实是运行在浏览器内核中的js引擎。为什么是这样的了?因为通俗来讲浏览器的作用就是用来浏览网页的,我们在浏览器除了执行js外还能执行其他的东西,比如我们在浏览器输入一个地址敲回车就可以发送请求并且接收服务器得响应。所以说...
day 32 jQuery插件 重复了
shasha
2021-02-25
阅读 3 分钟
880
jQuery.extend(): Merge the contents of two or more objects together into the first object.(把两个或者更多的对象合并到第一个文档中);
day32 jQuery 进阶
shasha
2021-02-23
阅读 10 分钟
836
jQuery中的Ajax:在jQuery中,下面6种方法只有load()需要jQueryDom对象打点来调,其他都是$直接调$.Ajax()方法属于最底层的方法;第2层是load(),$.get(),和$.post();第3层是$.getScript()和$.getJSON()方法;1. load() 方法结构:load(url , [data] , [callback] )案例1: load(url) {代码...} test.html 文件hello w...
day 31 jQuery进阶
shasha
2021-02-22
阅读 3 分钟
799
在jQuery中,$.Ajax()方法属于最底层的方法,第2层是load(),$.get(),和$.post(),第3层是$.getScript()和$.getJSON()方法。
day 30 jQuery
shasha
2021-02-22
阅读 8 分钟
915
1. 简介jQuery是一个兼容多浏览器的javascript库(函数库),核心理念是write less, do more(写得更少,做的更多)。JQuery,顾名思义,就是JavaScript和查询 (Query),即是辅助JavaScript开发的库。特点:Query 是一个快速的简洁的javascript框架,可以简化查询DOM对象、处理事件、制作动画、处理Ajax交互过程。提供了强大...
day16 初识面向对象编程
shasha
2021-01-18
阅读 4 分钟
810
day16 初识面向对象编程1. 面向对象和面向过程的区别面向过程: 强调过程步骤面向对象: 强调对象分析:围棋程序面向过程: 1.黑棋落子 2.绘制棋盘 3.判断输赢 4.白棋落子 5.绘制棋盘 6.判断输赢 7.黑棋落子面向对象:1.棋子 2.棋盘 3.规则对象(初步概念):你看到的,你想到的,有形的,无形的事物,都是对象。概括来说就是...
day15 DOM运动
shasha
2021-01-16
阅读 7 分钟
1.2k
JavaScript实现运动的原理,就是通过定时器不断改变元素的位置,直至到达目标点后停止运动。通常,要让元素动起来,我们会通过改变元素的 left 和 top 值来改变元素的相对位置。
day07
shasha
2021-01-06
阅读 4 分钟
874
对象就是一组数据,描述同一个概念的不同属性1. JSON对象:1) 定义:描述数据的一种格式,将若干个属性或方法整理成一个对象。可以方便的表示复杂对象。2) 语法:花括号键名要有双引号(字面量方式表示对象,键名不需要引号)字符串值要有引号键值之间是冒号 key:value键值对之间是逗号,最后一个键值对后面不要加逗号 {代...
day 06 数组
shasha
2021-01-05
阅读 4 分钟
951
一个变量只能存储一个数据,如果我们有一组数据,比如1到100一百个数字,定义100个变量来存储就太痛苦了,这时候我们就需要数组来存储这样的数据。数组类似于数学概念中的中的集合。
day18 移动端
shasha
2020-12-23
阅读 1 分钟
925
1. 移动端1) meta标签: {代码...} 布局视口(viewport):css作用的视口,默认值宽为980px可视视口:设备宽度所对应的范围完美视口: 布局视口 = 可视视口initial-scale (初始缩放比例) 1 不缩放minimum-scale:允许用户缩放到的最小比例(默认设置为1.0)maximum-scale:允许用户缩放到的最大比例(默认设置为1.0)user-s...
day17 阴影 背景图 响应式布局
shasha
2020-12-22
阅读 1 分钟
1.1k
1. 盒子阴影box-shadow: 水平偏移 垂直偏移 阴影模糊大小 阴影大小 阴影颜色 阴影位置(inset:里面);水平及垂直 向右和向下为正数,反之为负数2. 文本阴影text-shadow: 水平偏移 垂直偏移 阴影模糊大小 阴影颜色值的特点和盒子阴影一样3. 背景图大小background-size:宽度 高度;属性值:数值+px百分比关键字cover 图片不断...
day16 css3层级选择器 属性选择器 结构伪类 目标伪类 动态伪类
shasha
2020-12-21
阅读 1 分钟
851
2) flex-grow: 分配剩余空间。默认情况下值为0。元素有多宽,就占多大空间,当给某一个元素设置 flex-grow: 1,该元素会占满整个剩余空间,如果每个人都设置了,代表整个空间的分配的总份数。
day15 怪异盒模型 h5新增标签 多媒体 新增表单 弹性盒
shasha
2020-12-18
阅读 2 分钟
1k
1. 标准盒模型box-sizing: content-box总宽度 = 内容区width + 填充区左右(padding) + 边框左右(border) +margin2. 怪异盒模型触发怪异模型的两种方法:box-sizing: border-box总宽度=width+margin的左右缺失文档声明,在ie678的时候触发为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定...
day14 3d动画/位移/旋转/缩放
shasha
2020-12-17
阅读 2 分钟
1.3k
@keyframes 动画名{ 关键帧划分的是时间,一般百分比增量要相同 0%-100% 比如完成整个动画需要5s 0%{} 0s 10%{} 0.5s 20%{} 1s 50%{} 2.5s 100%{} 5s }
day13
shasha
2020-12-16
阅读 1 分钟
886
1. 2d位移变形我们目前学过,使用margin 和定位可以实现位移。下面我们使用transform来实现2d的位移。属性:transformx轴位移 transform:translateX(数值+px) 向右为正y轴位移 transform:translateY(数值+px) 向下为正xy都位移 transform:translate(x的位移,y的位移)特点:1)移动之后占位,和相对定位一样2)移动的百...
day12
shasha
2020-12-16
阅读 2 分钟
854
1. 高度塌陷(1) 高度塌陷的条件1) 子元素浮动2) 父元素没有设置高度(2) 解决办法1)给父元素添加overflow: hidden;(触发BFC)弊端:会把父元素之外的元素给隐藏掉2)给浮动元素的后面添加一个块级元素(div),给该元素设置clear属性。 clear: left/right/both; 清除浮动(清除浮动元素对自身的影响),只对块级元素生效弊端:...
day11 @import/隐藏元素/定位的补充/锚点
shasha
2020-12-14
阅读 2 分钟
1.3k
1. 引入外部样式表的方法(1)步骤: 1)在head标签里面,生成一个style的双标签 2)在style的标签里面写入@import url(css路径)(2)@import 和link的区别 1)@import只能引入css; link可以引入多种文件 2)加载顺序不同:@import先加载结构,后加载css。link是同时加载结构和css 3) @import 只支持ie5以上的浏览...
day10 溢出/宽高自适应/定位
shasha
2020-12-12
阅读 3 分钟
3.7k
1. 文本溢出 overflow(1)概念文本溢出 overflow 是指文字超出宽度的显示情况(2)属性值1)visible默认值,溢出正常显示2)hidden溢出隐藏/裁切3)scroll溢出则显示滚动条4)auto没溢出则正常显示;溢出则显示滚动条2. 文本溢出显示 text-overflowtext-overflow属性仅是:当文本溢出时是否显示省略标记,并不具备其它...
day9 表单和表格的补充
shasha
2020-12-10
阅读 1 分钟
891
1. 表单的补充(1) 单选框 {代码...} type为radio, 代表单选框当name属性值一样时, 可以互斥绑定信息 lable标签, 点击字的时候, 也能选择到圈 {代码...} 默认选择: checked (相当于 checked='checked')禁止选择: disabled(2) 多选框 {代码...} type为checkbox, 代表多选框(3) 下拉列表 {代码...} 默认选择: selected...
day8
shasha
2020-12-09
阅读 1 分钟
816
字体属性:font-size(大小) font-weight(加粗) font-family(字体类型) font-style(字体倾斜)文本类:color(文本颜色) text-align(水平对齐方式) text-indent(缩进) line-height(行高) word-spacing(词间距) letter-spacing(字符间距) text-transform(大小写转换)列表类:list-style-type(列表符号的类型) list-style-pos...
day7 盒模型
shasha
2020-12-08
阅读 2 分钟
957
值的设置:padding: 10px; 一个值, 设置四周padding: 10px 20px; 两个值, 上下 左右padding: 10px 20px 30px; 三个值, 上 左右 下padding: 10px 20px 30px 40px; 四个值, 顺时针 上右下左
day6 边框/列表/背景属性,浮动
shasha
2020-12-06
阅读 2 分钟
1.1k
1. 鼠标样式属性 cursor2. 边框属性(1)边框宽度 border-width属性值: 数值+px(2)边框样式 border-style属性值solid (实线)dashed (虚线)dotted (点状线)double(双实线)(3)边框颜色 border-color属性值: 颜色值, transparent(透明)(4)常用复合写法 border: 边框宽度 边框样式 边框颜色属性值之间用空格隔开属...
JSON
shasha
2020-04-16
阅读 1 分钟
1.1k
JSON JS 中的对象只有JS自己认识,其他语言都不认识 JSON就是一个特殊格式的字符串,这个字符串可以被任意的语言所识别,并且可以转换为任意语言中的对象 JSON在开发中主要用来数据的交互 (1) 用法:JSON 和JS对象的格式一样,只不过JSON字符串中的属性名必须加双引号,其他的和JS语法一致(2) 分类: 对象 数组 (3) JSON...
表单
shasha
2020-03-26
阅读 6 分钟
1.2k
1. 表单 表单的作用是用来将用户信息提交给服务器。比如:百度的搜索框,注册,登陆这些操作都需要填写表单。 form 标签 使用form创建的仅仅是一个空白的表单,我们需要向form中添加不同的表单项。 form 的action属性 form标签中必须指定一个action属性,该属性指向的是一一个服务器的地址。当我们提交表单时将会提交到a...
表格
shasha
2020-03-26
阅读 6 分钟
1.4k
表格在日常生活中使用的非常多,比如excel就是专门用来创建的工具。表格就是用来表示一些格式化的数据,比如: 课程表,银行对账单等。在网页中也可以创建出不同的表格。
背景图片
shasha
2020-03-25
阅读 3 分钟
1.5k
1. 背景图片 (1) background-image 设置背景图片 语法: background-image:url(相对路径)特点: 如果背景图片 大于元素,默认会显示图片的左上角 如果背景图片和元素一样大,则会将背景图片全部显示 如果背景图片小于元素大小,则会默认将背景图片平铺以充满元素 可以同时为一个元素指定背景颜色和背景图片,这样背景颜...
相对/绝对/固定定位
shasha
2020-03-25
阅读 6 分钟
2.7k
1. 定位: 指的就是将指定的元素摆放到页面的任意位置。 2. position属性 通过position属性来设置元素的定位 可选值: static 默认值,元素没有开启定位 relative 开启元素的相对定位 absolute 开启元素的绝对定位 fixed 开启元素的固定定位(也是绝对定位的一种) 当元素的position属性设置为relative时,则开启了元素...
高度塌陷问题
shasha
2020-03-24
阅读 9 分钟
4.1k
在文档流中,父元素的高度默认被子元素撑开,也就是说子元素多高,父元素就多高。但是, 当为子元素设置浮动后,子元素会完全脱离文档流。此时,将会导致子元素无法撑起父元素的高度,导致父元素的高度塌陷。
1
(current)
2
下一页
1
(current)
下一页