每日前端学习
文章平均质量分 73
一天天的学习笔记,方便自己与他人学习与复习
不能say的秘密
Have Fun!
展开
-
前端学习四
前端学习四1. CSS背景样式? background-color 背景色 background-image 背景图 url(背景地址) 默认:会水平垂直都铺满背景图 background-repeat 平铺方式 repeat-x x轴平铺 repeat-y y轴平铺 repeat ( x , y 都进行平铺,默认值 ) no-repeat 都不平铺 backgrou原创 2021-04-26 20:59:40 · 90 阅读 · 0 评论 -
前端学习三
前端学习三1、float浮动文档流文档流是文档中可显示对象在排列时所占用的位置。float特性加浮动的元素,会脱离文档流,会延迟父容器靠左或靠右排列,如果之前已经有浮动的元素,会挨着浮动的元素进行排列。float取值leftrightnone( 默认 )float注意点只会影响后面的元素。内容默认提升半层。默认宽根据内容决定。换行排列。主要给块元素添加,但也可以给内联元素添加。利用clear属性清除float浮动固原创 2021-04-26 19:48:40 · 278 阅读 · 0 评论 -
前端学习二
前端学习二1、CSS背景样式background-color:背景颜色background-image:背景图片background-repeat:背景图片的平铺方式background-position:背景图片的位置background-attachment:背景图随滚动条的移动方式2、CSS边框样式border-style:边框的样式border-width:边框的大小border-color:边框的颜色3、CSS文字样式font-f原创 2021-04-25 18:28:21 · 80 阅读 · 0 评论 -
前端学习一
前端学习一1、WEB前端的三大的核心技术:HTML : 结构CSS : 样式Javascript : 行为Web开发者助手 FeHelper:https://www.baidufe.com/fehelper2、HTML基础内容! + tab键 : 快速的创建html的初始代码标签的属性:来修饰标签的,设置当前标签的一些功能。<标签 属性=“值” 属性2=“值2”>初始代码模板:<!DOCTYPE html><html lang="en"&g原创 2021-03-30 18:25:57 · 144 阅读 · 0 评论 -
监听器
监听器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title&g原创 2020-12-15 16:00:53 · 111 阅读 · 0 评论 -
表单输入绑定v-model
表单输入绑定v-modelv-model 双向的数据绑定双向数据流(绑定):页面改变影响内存(js),内存(js)改变影响页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale">原创 2020-12-15 15:34:19 · 445 阅读 · 0 评论 -
v-for的列表渲染
v-for的列表渲染 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale"> <meta http-equiv="X-UA-Compatible" content="i原创 2020-12-15 10:11:27 · 81 阅读 · 0 评论 -
v-on的事件绑定
v-on的事件绑定事件修饰符在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在方法中轻松实现这点,但更好的方式是:方法只有纯粹的数据逻辑,而不是去处理 DOM 事件细节。为了解决这个问题,Vue.js 为 v-on 提供了事件修饰符。之前提过,修饰符是由点开头的指令后缀来表示的。<!-- 阻止单击事件继续传播 --><a v-on:click.stop="doThis">&原创 2020-12-15 09:51:27 · 180 阅读 · 0 评论 -
指令之v-on的使用
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>指令之v-o.原创 2020-12-15 09:37:52 · 178 阅读 · 0 评论 -
条件渲染及v-bind
vue中常用的v-指令演示v-text:元素的textContent属性,必须是双标签跟{{}}效果是一样的使用较少v-html:元素的innerHTMLv-if :判断是否插入这个元素,相当于对元素的销毁和创建v-else-ifv-elsev-show隐藏元素如果确定要隐藏,会给元素的style加上display:none。是基于css样式的切换v-if和v-show的区别(官网解释)v-if是“真正"的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v原创 2020-12-14 22:23:00 · 369 阅读 · 0 评论 -
指令之v-text和v-html
指令之v-text和v-html1、什么是指令:在vue中提供了一些对于页面+数据的更为方便输出。2、实战训练:<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale"> <meta http-equiv="X-UA原创 2020-12-08 16:12:17 · 83 阅读 · 0 评论 -
vue的起步和插值
vue的起步和插值:1、历史介绍vue2014年,用户体验好作者:尤雨溪2、实例训练:<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale"> <meta http-equiv="X-UA-Compatible原创 2020-12-08 16:00:11 · 103 阅读 · 0 评论