![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
文章平均质量分 81
xyyojl
希望自己能够持之以恒,坚持下去,做更好的自己。
展开
-
01 - 常用的html标签
第一章:常用的html标签作业问题和提示:开发工具:editplus,不要使用记事本,记事本有点毛病,一开始就是直接使用editplus,熟悉代码。后缀,把文件的后缀名显示出现态度:尽自己最大的努力标点符号(英文半角标点符号,中文标点符号的话,默认占两个字符)ctrl+b快捷打开浏览器,需要配置浏览器的位置C:\Program Files (x86)\Google\Chrome\...原创 2018-06-24 15:08:55 · 211 阅读 · 0 评论 -
08 - hover初讲与文字属性初讲
鼠标悬浮伪类hover状态是什么,页面中的元素的状态会变化吗?状态是在不同的情况下,页面的元素表现出现不同的效果,可以理解为简单的交互页面的元素会发生常见的状态的变化就是:鼠标悬浮效果叫做hover伪类页面都是存在某种状态hover的使用方法1.在选择器中选择某些元素2.并添加状态判断,满足条件就能加载样式p{/* 满足某种条件的元素 */ color:...原创 2018-09-11 08:10:24 · 365 阅读 · 0 评论 -
09 - vertical-align和line-height
vertical-align和line-height文本水平对齐方式text-align.para{ width: 500px; background-color: #ccc; text-align: justify;/*左右均分对齐,文字必须不是处于最后一行,必须有换行*/}<p class='para'>页面的主体内容展示区域</p&g...原创 2018-09-11 08:14:51 · 136 阅读 · 0 评论 -
10 - 浮动
浮动floatcss标准文档流布局脱离文档流浮动float是什么?浮动的特性与对文字的影响与inline-block的对比清除浮动的意义与解决办法min-width的运用css标准文档流布局页面布局的默认状态特点:从左到右从上往下流式排列,最终窗口自上而下分成一行一行,每行从左往右顺序(依代码)排放元素,块元素独占一行,内联元素并列。脱离文档流将元素...原创 2018-09-11 08:16:53 · 151 阅读 · 0 评论 -
css3实现云彩动画
##css3实现云彩动画所需的知识:定位固定定位position: fixed相对定位position: relative绝对定位position: absolute静态定位position: static背景background-colorbackground-imagebackground-repeatbackground-positionbackground-...原创 2018-09-19 18:43:25 · 3575 阅读 · 0 评论 -
03 - JavaScript(函数,实参,形参,)
函数/实参/形参函数的分类匿名函数: 没有名字的函数 匿名函数不能独立存在有名/具名函数: 有名字的函数匿名函数的使用例子,通过事件触发&amp;amp;lt;!DOCTYPE html&amp;amp;gt;&amp;amp;lt;html&amp;amp;gt;&amp;amp;lt;head&amp;amp;gt; &amp;amp;lt;met原创 2018-09-19 22:19:37 · 168 阅读 · 0 评论 -
14 - 表格
表格表格table的构成table默认特征table默认样式清除table-layouttable的合并display: table的特性表格具有display的类型表格的构成表格是以table标签定义: 表格下面的标签 组成的部分 caption 表格的标题文字 thead 整个表格的表头部分(头部) tbody ...原创 2018-09-14 21:23:59 · 247 阅读 · 0 评论 -
15 - 高级选择器
高级选择器选择器复习伪类选择器结构性伪类选择器属性选择器伪元素before/after选择器复习 选择器 选择器的使用 ID选择器 `#box 类名选择器 .box 标签选择器 div 通配符选择器 * 多元素选择器 div,p 后代选择器 div ul li 毗邻选择器 ul...原创 2018-09-14 22:18:24 · 138 阅读 · 0 评论 -
前端入门阶段怎么学
哪些东西必须学?搞清楚前端要学什么?需要学习的语言HTMLCSSJavaScriptHTTPHTML记住常用的标签,div span,input meta之后见到一个稍微记一下使用到才去了解一些标签CSS语法CSS选择器属性.xxx > .yyy + p{color: red;},学了语法就不要往下学,之后会经常使用HTML和CSS套路左中右布局...原创 2018-10-11 09:30:56 · 218 阅读 · 0 评论 -
计算机是如何存储数据的
前端为什么要学编程基础?操作系统运行在硬件之上浏览器运行在操作系统之上HTML/CSS/JS运行在浏览器之上HTML/CSS/JS和数据都来自服务器存在三层依赖,所以我们前端需要学习编程基础,我们才会知道CSS/JS是怎样运行的?JS的变量存储在哪里?数据怎么从服务器获取?计算机: 二进制的世界如何存储0和1如何存储数字如何存储字符如何存储中文如何...原创 2018-10-11 09:32:24 · 10531 阅读 · 2 评论 -
04 - JavaScript(流程控制,比较运算符,for循环)
#if/for循环流程控制###比较运算符> < >= <= == != === !==== 表示等于!= 不等于=== 全等于(除了判断值,还会判断数据类型,下同)!==不全等于比较之后得到的结果都是booleanif条件语句当条件为真时,执行代码,条件为假时,不管if (条件) { console.log("条件为真");}两条分支i...原创 2018-09-20 22:11:39 · 171 阅读 · 0 评论 -
鼠标滑入图片切换
浮动文字样式背景图片兄弟选择器盒子模型效果图:代码展示:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width原创 2018-09-21 22:15:06 · 585 阅读 · 0 评论 -
git-入门
##git入门git initgit addgit commit -v###git init初始化本地仓库 .git下面通过操作展示一下打开git Bash,运行cd ~/Desktop/,进入电脑桌面通过mkdir demo,创建demo文件夹进入目录 cd demo运行git init,初始化仓库运行ls -al,查看本地仓库###git addgit add...原创 2018-10-08 11:15:48 · 178 阅读 · 0 评论 -
HTTP入门之请求与响应
##HTTP入门curl命令的使用HTTP请求HTTP响应###一、curl命令的使用####1. GET请求curl -s -v -H "xxx: yyy" -- "https://www.baidu.com"如果不清楚,如何使用curl命令的话,可以查看常用命令行的使用及explainshell.com的使用技巧,这里就不多讲,废话少说,直接进入正题。-s 不要显示进度...原创 2018-10-08 11:16:45 · 306 阅读 · 0 评论 -
常用命令行的使用及explainshell-com的使用技巧
##学习命令行explainshell.com的使用技巧金山词霸常用命令行的使用###explainshell.com的使用技巧###ls命令进入explainshell.com网站,然后搜索ls,直接按回车,详情请查看下图搜索的结果如图:这是作为一个英语不是很好的程序员,需要借助工具,正所谓“工欲善其事,必先利其器”。将上一张图片用矩形框起来的内容进行翻译。list di...原创 2018-10-08 11:17:48 · 422 阅读 · 0 评论 -
13 - 表单
表单form表单form表单的属性表单控件表单的伪类表单表单元素时允许用户在表单中输入信息的元素(比如:文本域,下拉列表,单选框,复选框等等),可以提交信息form是一个载体,规划一系列提交信息的控件集合体form表单的属性action 处理当提交表单时向何处(url)发送表单数据,谁响应我们的提交method 规定用于发送form-data的HTT...原创 2018-09-13 22:01:16 · 158 阅读 · 0 评论 -
02 - JavaScript(获取元素的其他方式,字符串拼接,数据类型)
一个对象添加多个样式获取元素的其他方式得出获取元素的相关结论字符串拼接数据类型###一个对象同时添加多个样式<!doctype html><html> <head> <meta charset="UTF-8"> <style> *{ margin: 0; p...原创 2018-09-18 21:49:36 · 237 阅读 · 0 评论 -
02 - 常用的html标签
02 - 常用的html标签div标签(盒子标签)div:division被划分出来的一块区域独占一行,霸道总裁,双标签img标签图片标签(一张图片在页面里的表现,单标签)不要加/用于标签的闭合结束,自闭和结束,因为h5已经把这个/给去掉了img标签具有自己的属性:src/alt/width/height,其余属性title,因为每一个标签的都有title属性,所以叫做...原创 2018-06-24 15:16:28 · 135 阅读 · 0 评论 -
03 - 常用css和css规范
03 - 常用css和css规范在我们的实际开发过程中,不会直接通过strong标签(em标签)调整元素,用css去调整页面中元素的样式1.CSS-层叠样式表(Cascading Style Sheets)层叠:css的样式存在,有一定的样式规则,根据样式规则的优先级决定是否覆盖样式表:描述元素在页面中的展示效果,将页面的元素的展示效果分离出来单独控制,结构和样式分离,用css...原创 2018-07-25 21:48:45 · 551 阅读 · 0 评论 -
04 - 盒子模型解析
04 - 盒子模型解析1.class补充两个或以上*class类名中间需要空格*间隔,代码如下:&amp;amp;lt;head&amp;amp;gt; &amp;amp;lt;style&amp;amp;gt; .list li{ color:red; } .blue{/*可复用性*/ baclground-color:原创 2018-07-27 21:26:05 · 1297 阅读 · 0 评论 -
05 - 标准盒模型和怪异盒子模型
两种盒子模型普通盒模型:普通盒模型触发方式:box-sizing: content-box;宽高到底怎样计算?正常情况:(普通盒模型)内容盒子盒子的整体宽度 = width + border + padding/左border+左padding+width+右padding+右border盒子的整体高度 = height+ border + padding/上b...原创 2018-07-27 21:55:31 · 1010 阅读 · 0 评论 -
06 - 元素的显示类型转换与样式初始化
元素类型与样式初始化1. 样式初始化样式为什么要初始化?这个世界上有很多浏览器firefox/chrome/ie/opera等等,不同浏览器,不同浏览器版本对于页面的解析效果不相同,甚至同一个浏览器不同的版本都不一致,直接导致我们做出的布局会乱掉我们做出的页面做不同的浏览器上展示有可能是不同的,重点是影响布局,不要让浏览器污染我们的布局浏览器的内核: 浏览器 内...原创 2018-07-27 22:16:56 · 170 阅读 · 0 评论 -
07 - 背景background和圆角
背景background和圆角,你知道多少,快来了解一下吧原创 2018-09-03 12:06:16 · 5472 阅读 · 0 评论 -
16 - 过渡
过渡和动画过渡是什么?写法和特点过渡的特性,使用环境动画是什么?关键帧是什么?动画的特性,使用环境过渡和动画的区别过渡和动画在不使用flash或者Javascript的情况下做出元素的规律运动的效果,可以使页面变得非常丰富,增强用户体验。过渡 transition过渡是使元素由一种样式变成另一种样式,为变化添加过程与效果,为元素添加transition样式...原创 2018-09-15 22:18:49 · 296 阅读 · 0 评论 -
11 - css3渐变
css3渐变鼠标样式透明度的使用以及兼容性写法(针对IE的大傻逼)线性渐变径向渐变鼠标样式(cursor)规定当鼠标进入元素呢内容区域显示的光标类型只需要修改cursor的对应的值cursor指针样式cursor: default;/* 箭头 */cursor: auto;/* 默认,根据浏览器设置的光标 */cursor: move:/* 可拖拽...原创 2018-09-12 11:20:29 · 888 阅读 · 0 评论 -
12 - 定位
定位定位是什么?定位的特性定位的类型相对定位与绝对定位的区别固定定位z-index绝对定位元素居中的方式定位是什么定位可以准确控制元素的位置状态,定位允许你从正常的文档流布局中取出元素,并使她们具有不同的行为,比如放在另一个元素的上面参照物与坐标参照物:你在哪我就在哪,我就远远的望着你,不离不弃坐标方向:left: 左到右为正/top: 上到下为...原创 2018-09-12 14:10:56 · 197 阅读 · 0 评论 -
17 - 变换,阴影,遮罩
变换,阴影,遮罩一.2D变换transform scale缩放 取值 大于0小于1 是缩小 大于1是放大 translate 位移 translateX() / translateY 属性值第一个是X轴方向上,第二个是Y轴方向上 skew 倾斜 skewX() / skewY() 属性值第一个是X轴方向上,第二个是Y轴方向上 transf...原创 2018-09-16 22:14:31 · 371 阅读 · 0 评论 -
18 - 弹性盒模型
弹性盒模型flex的兼容性什么是弹性盒模型flex容器与flex项目父元素控制子元素整体子元素的私有特性flex的兼容性旧版本的flex写法只支持旧的语法书写最早 display:box过渡display:flex box当今标准 display:flex兼容性与浏览器内核兼容性写法,针对老版本的浏览器不能识别最新版的,针对某一些样式,在浏览器中不支...原创 2018-09-17 15:24:16 · 211 阅读 · 0 评论 -
19 -iframe,iconfont,swiper
iframe/iconfont/swiperiframeiconfontswiperiframeiframe是什么?iframe是一个标签,可以在页面中插入另外的文本/页面内容类似于img,可以引入内容替换iframe标签iframe的特点属性:width/height 类似图片的宽高(无单位)frameborder = ‘1’/’0’ 是否...原创 2018-09-17 15:25:48 · 233 阅读 · 0 评论 -
20 - HTML5新标签和响应式
HTML5新标签和响应式HTML5新标签代码规范响应式visibility的使用HTML5是什么HTML5:标准HTML的第五代版本新增功能:增加了许多移动端的支持,广义上讲HTML5提供了一套全新的界面设计制作的解决方案本地存储技术:可以制作基于网页的APP,代替普通APP兼容性:提供性的数据与应用的接口,可直接调用外部比如摄像头接口:连接推送: ...原创 2018-09-17 21:59:30 · 1220 阅读 · 0 评论 -
01 - JavaScript(声明变量方式,变量,注释)
js的代码写在哪里?如何获取操作元素的权力(DOM)操作元素权力一次性,操作100次需要用到变量(给人起文字 = 变量名),变量的命名规范三种声明变量的方式的区别注释innerHTML /innerTextonload/deferjs代码写在哪里?行内,写在标签属性里面,不推荐使用内部,代码需要放在script(双标签)标签里面,script标签的位置任意,解析到scrip...原创 2018-09-18 21:44:20 · 738 阅读 · 0 评论 -
记:css绘制小猪佩奇的项目及踩过的坑
下面是我项目的代码和预览链接,觉得项目好看又实用的小伙伴,随手给个star, 您的star是我最大的动力!!!项目源码 预览链接移动端实现效果的展示,点击download下载观看这一项目的主题的是画一只小猪佩奇给你贺新年,好了,废话不多说,我们进入正题:项目介绍为什么做这个项目:其实是因为今年是乙亥猪年,所以就想结合所学知识实践一下,所以想来想去,最终决定了画小猪佩奇给大家贺新年,小猪佩...原创 2019-02-16 13:58:35 · 528 阅读 · 2 评论