- 博客(20)
- 收藏
- 关注
RSS订阅原创 计算属性相较于插值语法和methods实现的优势
插值语法<html>...<head>...<title>姓名案例_插值语法实现</title>//引入Vue<script type="text/javascript" src="../vue.js"></script></head><body> //准备好一个容器 <div id="root"> 姓： <input type="text" v-model="
2022-04-21 19:43:30
269
原创 Vue基础语法
Vue模板语法有2大类：1.插值语法：功能：用于解析标签体内容。写法：{{XXX}}，XXX是Js表达式，且可以直接读取到date中的所有属性。2.指令语法：功能：用于解析标签（包括：标签属性、标签内容、绑定事件…）。举例：v-bind:href=“XXX” 或简写为：href=“XXX”,XXX同样要写js表达式，且可以直接读取到date中的所有属性。备注：Vue中有很多的指令，且形式都是：v-???,此处我们只是拿v-bind举个例子。Vue中有2种数据绑定的方式：1.单向绑定
2022-04-10 19:43:52
1131
原创 初始Vue实例代码分析
Vue初始代码基础<html> <head> ... <title>初始Vue</title> // 引入Vue <script type="text/javascript" src="../js/vue.js"></script> </head> <body> //准备好一个容器 <div id="root"> <h1>
2022-04-06 21:07:15
1231
原创 又是没学习的一天
啊啊啊啊，今天就上了一节课，下午在宿舍睡觉也睡不着，就那样呆呆的坐了一下午，不想学习，不想看书，代码一直报错！！！睡觉睡不着~该怎么办没心思学习，没法全身投入，又总觉得很累，我好菜啊...
2022-03-08 20:35:56
137
原创 JS基础&自增与自减
也真是菜，当时上课没学明白，没好好听，现在终于开窍了~自增：自增 ++通过自增可以使变量在自身的基础上增加1对于一个变量自增以后，原变量的值会立即自增1自增分两种： 后++（a++）和前++（++a）无论是a++还是++a，都会立即使变量的值自增1不同的是a++和++a的值不同a++的值等于原变量的值（自增前的值）++a的值等于原变量新值（自增后的值）自减：通过自减可以使变量在自身的基础上减1对于一个变量自减以后，原变量的值会立即自减1自减分两种： 后–（a–）和前–（--.
2022-01-21 12:38:52
1006
原创 JS基本数据类型
JS基本数据类型String 字符串Number 数值Boolean 布尔值Null (空值)类型的值只有一个nullUndefined （未定义）类型的值只有一个undefined强制类型转换将其他的数据类型转换为Stringa原本为number型a = 123;调用 a 的toString（）方法a = a.toString();调用String（）函数，来将a转换为字符串（作为参数传递给函数）a = String(a);将其他的数据类型转换为Nu
2021-12-09 19:35:57
265
原创 JS基础&基本语法
第一句JS语句输出语句：...<script type="text/javascript">//控制浏览器弹出一个警告框 alert("你真有趣！");//让计算机在页面输出一个内容 document.write("你也不赖！");//向控制台输出一个内容 console.log("我在控制台哟~");</script>可以将js代码编写到标签的onclick属性中<body> <button onclick="ale
2021-12-04 15:43:05
690
原创 rem适配方案
让一些不能等比自适应的元素，达到当设备尺寸发生改变的时候，等比例适配当前设备。使用媒体查询根据不同设备按比例设置html的字体大小，然后页面元素使用rem做尺寸单位，当html字体大小变化元素尺寸也会发生变化，从而达到等比例缩放的适配。rem + 媒体查询 + less 技术元素大小取值方法最后公式：页面元素的rem值=页面元素值（px）/（屏幕宽度/划分的份数）屏幕宽度/划分的份数 就是html font-size的大小或者：页面元素的rem值=页面元素值（px）/ html font.
2021-11-22 16:28:29
289
原创 Less基础(CSS预处理器）
Less中文网址： http://lesscss.cn///改的时候只需要修改第一行`@color: green;`这部分所需部分即可//定义一个字体的变量@font14: 14px;//定义一个绿色的变量 @color: green;body { background-color: @color; }div { color: @color; }引入html<style>...</style>/*nest为文件名*/<
2021-11-22 11:15:25
335
原创 rem基础&媒体查询
rem基础<style> html { font-size: 12px; } div { font-size: 12px; width: 15rem; height: 15rem; } p { /*1.em相对于父元素的字体大小来说的*/ width: 10em; height: 10em; /*2.rem相对于html元素字体大小来说的*/ width: 10rem;
2021-11-21 17:54:01
204
原创 移动端基础
多倍图在标准的viewport 设置中，使用倍图来提高图片质量，解决在高清设备中的模糊问题背景图片 注意缩放问题/*在iphone8下面*/img{/*原始图片100*100px*/width:50px;height:50px;}.box{/*原始图片100*100px*/background-size: 50px 50px;}移动端CSS初始化推荐使用normalize.css特殊样式...
2021-11-16 20:48:07
45
原创 动画效果展示
简写属性里面不包含animation-play-state暂停动画：animation-play-state: puased;经常和鼠标经过等其他配合使用想要动画走回来，而不是直接跳回来：animation-direction: alterlate盒子动画结束后，停在结束位置：animation-fill-mode: forwards地图点亮城市类波纹.city div[class="pulse"]{/*保证小波纹在父盒子里面水平垂直居中，放大后就会中心向四周发散*/position: ..
2021-11-15 17:27:29
217
原创 CSS3 2D 转换&缩放scale
2D转换中的缩放scale1为放大=1为没变0<x<1为缩小/*等比例缩放2倍*/transform: scale(2,2);2D转换综合写法同时使用多个转换transform: translate() rotate() scale()...其顺序会影响转换效果（先旋转会改变坐标轴方向)当我们同时有位移和其他属性的时候，记得要将位移放到最前...
2021-11-09 19:04:26
146
原创 CSS3 2D转换&旋转
旋转 rotateimg {/*顺时针旋转45度*/transform: rotate(45deg);/*过渡写在本身上，谁做动画给谁加*/transition: all 0.3s;/*0.3是指时间*/}img:hover {/*鼠标经过时旋转指定度数*/transform: rotate(360deg);写三角div { position:relative; width: 249px; height: 35px; border: 1.
2021-11-09 18:23:32
110
原创 CSS3 2D转换移动盒子
2D转换移动 盒子的位置translate不影响其它任何盒子div {/*写法一*//*x指x轴上移动的位置上，y指y轴上移动的位置*/transform: translate(x,y);transform: translate(100px,100px);/*写法二*//*单独写*/transform: translateX(100px);translate中的百分比单位是相对于自身元素的translate:(50%,50%);CSS之前写法：固定了p {position:.
2021-11-09 10:02:47
163
原创 CSS3伪类选择器&浮动与定位分析
HTML5新增标签div span:nth-child(2) {}:nth-child(n) 选择 父元素里面的第n个孩子，他不管里面的孩子是否同一种类型。of-type选择指定类型的元素div span:first-of-type {background-color:blue;div span:last-of-type {background-color:skyblue;div span:nth-of-type(2) {background-color:skyblue;伪类
2021-11-08 21:20:04
248
原创 CSS基础选择器
CSS《一》CSS基础选择器选择器分类.选择器分为基础选择器和复合选择器两大类。基础选择器*基础选择器是由单个选择器组成的。*基础选择器又包括：标签选择器、类选择器、id选择器和通配符选择器。标签选择器标签选择器（元素选择器）是指用HTML标签名称作为选择器，按标签名称分类，为页面中某一类标签指定统一的CSS样式。语法标签名{ 属性1： 属性值1； 属性2： 属性值2； 属性3： 属性值3； ... }作用：标签选
2021-09-06 16:13:56
147
原创 HTML常用标签（下）
HTML常用标签（下）表格标签表格的基本语法<table> <tr> <td>单元格内的文字</td> ... </tr> ...</table><table></table>是用于定义表格的标签。<tr></tr>用于定义表格中的行，必须嵌套在<table></table>标签中.
2021-08-11 13:59:55
202
原创 前端入门 HTML常用标签
HTML常用标签标题标签<h1>-<h6>单词head的缩写，意为头部、标题。<h1>我是一级标题</h>*标签语义：*作为标题使用，并且依据重要性递减。特点：加了标题的文字会变的加粗，字号也会依次变大。一个标题独占一行。段落标签<p>我是一个段落标签</p>*标签语义：*可以把HTML文档分割为若干段落。特点:文本在一个段落中会根据浏览器窗口的大小自动换行。段落与段落之间保有空隙。换行标签
2021-08-04 21:33:54
92
原创 前端入门笔记
HTML1.什么是网页？网页是构成网站的基本元素，它通过由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以.htm或.html后缀结尾文件，因此将其俗称为HTML文件。2.什么是HTML？HTML 指的是超文本标记语言，它是用来描述网页的一种语言。HTML 不是一种编辑语言，而是一种标记语言。标记语言是一套标记标签。3.Web标准提出的最佳体验方案：结构、样式、行为相分离。结构写到HTML 文件中，表现写到CSS文件中，行为写到JavaScript文件中。HTML语法规范
2021-08-02 14:02:49
87
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人