2022年1月12日
二、开发toast插件
摘要： 1、在src》components》创建文件夹my-button(用来存放组件和插件)》创建文件button.vue(用来存放my-button组件)》 （1）在模板中，创建一个带有默认插槽值的button按钮 <button class="btn"><slot>按钮</slot></button> 阅读全文
posted @ 2022-01-12 22:15 Strugglinggirl 阅读(117) 评论(0) 推荐(0)
六、响应式网站布局实例
摘要： 1、简单的响应式网站布局 <!-- 实现方式：div浮动+（断点）媒体查询。 --> <!DOCTYPE html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-sca 阅读全文
posted @ 2022-01-12 15:10 Strugglinggirl 阅读(291) 评论(0) 推荐(0)
五、页脚footer
摘要： <!DOCTYPE html> <head> <meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>页脚</title> <style> * { box-sizing: 阅读全文
posted @ 2022-01-12 15:06 Strugglinggirl 阅读(35) 评论(0) 推荐(0)
四、（3）网格布局+媒体查询
摘要： （1）网格布局 <!DOCTYPE html> <head> <meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>网格布局</title> <style> *{ bo 阅读全文
posted @ 2022-01-12 15:04 Strugglinggirl 阅读(74) 评论(0) 推荐(0)
四、（2）列布局+媒体查询
摘要： （1）列布局 <!-- 适用：IE11以上包括11 优点：弹性框布局模块，无需使用浮动或定位。 例如：无需知道弹性项目的高度，只要设置弹性容器在x轴和y轴上的居中对齐弹性项目，即可实现弹性项目的完美居中。 --> <!DOCTYPE html> <head> <meta charset="utf-8 阅读全文
posted @ 2022-01-12 15:02 Strugglinggirl 阅读(35) 评论(0) 推荐(0)
四、（1）网格视图+媒体查询
摘要： （1）网格视图 <!DOCTYPE html> <head> <meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>网格视图</title> <style> *{ bo 阅读全文
posted @ 2022-01-12 15:01 Strugglinggirl 阅读(34) 评论(0) 推荐(0)
三、下拉菜单dropdown
摘要： （1）基础下拉菜单 <!DOCTYPE html> <head> <meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>基础下拉菜单</title> <style> / 阅读全文
posted @ 2022-01-12 14:56 Strugglinggirl 阅读(121) 评论(0) 推荐(0)
二、导航栏nav
摘要： 一、垂直导航栏 （1）基础版 <!DOCTYPE html> <head> <meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1.0"> <title>垂直导航栏</title> <styl 阅读全文
posted @ 2022-01-12 14:46 Strugglinggirl 阅读(242) 评论(0) 推荐(0)