随笔分类 -  H5和CSS3

摘要:功能需求: 在下拉框中选择你所需要缩放的比例, 选择好了之后,图片会按照你选择的比例进行缩放 1==》如何获取select中option选中的值 在select添加事件change 和双向绑定v-model <select @change="changeValue" v-model="myVal"> 阅读全文
posted @ 2019-11-29 22:03 南风晚来晚相识 阅读(1240) 评论(0) 推荐(0) 编辑
摘要:FormData对象介绍FormData字母意思是表单数据,H5新增的一个内置对象。可以获取任何类型的表单数据,如text radio checkbox file textarea 常用语发送ajax请求优点:简单的代码,就可以将表单中所有的类型的数据都可以搜集到,包括文件域的内容。非常方便。缺点: 阅读全文
posted @ 2019-11-24 20:53 南风晚来晚相识 阅读(482) 评论(0) 推荐(0) 编辑
摘要:display: flex; justify-content: space-between; flex-direction: column; <style> *{ padding: 0; margin: 0; } ul{ height: 300px; border: 4px solid red; d 阅读全文
posted @ 2019-11-13 22:25 南风晚来晚相识 阅读(412) 评论(0) 推荐(0) 编辑
摘要:display: flex; 的默认轴是x轴 justify-content: 设置主轴上的子元素排列的方式 所以在使用之前要确定好哪一个是主轴 /* justify-content:flex-start; 如果主轴是x,从左到右 如果主轴是y,从上到下*/ /* justify-content: 阅读全文
posted @ 2019-11-08 22:06 南风晚来晚相识 阅读(234) 评论(0) 推荐(0) 编辑
摘要:align-content 运用在父级元素上 align-content: 它通常与子元素的div{ margin:10px } 一起联合使用。 用在子项出现换行的情况下,并是多行的情况下哦。运用在子项侧轴上的排列方式。 align-content的值 align-content: flex-sta 阅读全文
posted @ 2019-11-06 00:19 南风晚来晚相识 阅读(1633) 评论(0) 推荐(0) 编辑
摘要:flex-wrap:运用到父元素上 结合 display: flex; flex-wrap: wrap; 换行 flex-wrap: nowrap; 不换行 #main { width: 300px; height: 300px; border: 1px solid #c3c3c3; display 阅读全文
posted @ 2019-11-06 00:10 南风晚来晚相识 阅读(1441) 评论(0) 推荐(0) 编辑
摘要:侧轴是相对的 默认主轴是x 所以侧轴就是y轴 align-items设置侧轴上的子元素排列的方式(单行)纵轴方向上的对齐方式 align-items: flex-start; 顶部对齐 align-items: center; 居中对齐 align-items: flex-end; 底部对齐 ali 阅读全文
posted @ 2019-11-06 00:08 南风晚来晚相识 阅读(1721) 评论(0) 推荐(0) 编辑
摘要:/* justify-content: space-around; 运用在父级元素上 第一个子元素距离左边的距离==最后一个子元素距离右边的距离 除第一个子元素和最后一个子元素外,第2个,第3个...一直到倒数第二个子元素,这些子元素距离左右两边的间距都是相等 巧记:around 是四周,说明四周是 阅读全文
posted @ 2019-11-05 20:34 南风晚来晚相识 阅读(2240) 评论(0) 推荐(0) 编辑
摘要:sessionStorage的简单使用 <body> <button id="btn1">设置值</button> <button id="btn2">获取值</button> <!-- 总结:设置值 值是字符串 sessionStorage.setItem('key','value'); 使用se 阅读全文
posted @ 2019-02-23 22:44 南风晚来晚相识 阅读(6813) 评论(0) 推荐(0) 编辑
摘要:透明度 opacity 一个元素的 opacity 属性会应用在这个元素的本身和它的子孙上。 opacity的值在0--1;0表示完全的透明(看不见) 兼容所有的浏览 img{ filter:Alpha(opacity=45); //它的值在0-1 opactiy:0.45; //兼容IE8以下; 阅读全文
posted @ 2019-02-23 18:58 南风晚来晚相识 阅读(371) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示