yookooi

电视剧《点燃我温暖你》中理工男李峋做的爱心代码非常好看，今天搬运来一个完整代码，快给你的那个她露一手吧~

view入门---npm指令

vue入门---cmd常用命令

1、align-self 项目对齐方式（1）align-self属性表示当前项目可以和其他项目拥有不一样的对齐方式。（2）取值auto（默认值）：和父元素align-self的值一致，具有继承性 flex-start：该项目顶端对齐 flex-end：该项目底部对齐 center：竖直方向上居中对齐 baseline：item第一行文字的底部对齐 stretch：当item未设置高度时，item将和容器等高对齐（3）上机实例 .box{

一、弹性盒子模型是什么Flex:弹性布局盒模型Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性是2009年w3c提出的一种可以简洁，快速弹性的布局属性。W3C提出了一种新的方案----Flex布局，可以简便、完整、响应式地实现各种页面布局。它已经得到了几乎所有浏览器最新版本的支持，但是考虑历史版本，在部分浏览器上兼容性不太好，需要在代码中添加浏览器支持。主要思想：给予容器控制内部元素高度和宽度的...

一、css--分栏 columns1.属性值column-width 栏宽 列宽 column-count 栏数 列数 columns:栏宽 栏数 column-gap 列间距 栏间距 column-rule 宽度、样式、颜色2.上机实例 p{ column-width: 200px; column-count: 4; columns: 200px 4; column-gap: 20p

一、变换transform1.移动 translate在水平和垂直方向上的移动， translateX(数值+单位) 水平移动 translateY(数值+单位) 垂直移动 translate(X, Y) 斜着移动

一、阴影1.文本阴影:text-shadow属性为文本添加阴影，在文本中添加一个或多个阴影。 text-shadow: -2px 5px 3px skyblue, 0px 30px 92px rgba(228, 49, 49, 1),0px 46px 134.83px rgba(214, 144, 144, 1); /* text-shadow:; */ /* 值分别为水平...

1.兄弟选择器（1）相邻兄弟选择器E + F { } 紧挨选择器E后的那个兄弟选择器F/* 相邻兄弟选择器 */ p+span{ color: #f00; }（2）通用选择器通用兄弟选择器E ~ F{ }选择器E后的所有的兄弟选择器F /* 通用兄弟选择器 选择p元素后的所有span兄弟选择器 可以选到多个元素 */ p~span{ ...

一、html5是什么HTML5 是最新的 HTML 标准。 HTML5 是专门为承载丰富的 web 内容而设计的，并且无需额外插件。 HTML5 拥有新的语义、图形以及多媒体元素。 HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。 HTML5 是跨平台的，被设计为在不同类型的硬件（PC、平板、手机、电视机等等）之上运行。二、新增语义化标签html5中新增的语义化标签可以分为两大类：块元素标签和内联元素标签。1.块元素标签（1）<header&gt

一、浮动1.属性值：float：left 左浮动 float：right 右浮动 float：none 默认值 不浮动2.二、定位三、清除浮动

一、背景颜色background-color 背景颜色tips：推荐使用十六进制表示法或rgb表示法，尽量避免使用表示颜色的单词，以免造成浏览器不识别的问题。h1 { background-color: green;}div { background-color: lightblue;}p { background-color: yellow;}二、背景图像background-image 背景图片值: url("图片路径")body { ba.

一、选择器1.通配符选择器（1）通配符选择器：选择所有的元素（标签），通常用来做 格式化元素（标签）（2）基本格式 *{ 样式属性名 : 属性值 ; ... }（3）实例/* 通配符选择器 */*{ border: 1px solid #00000F; margin: 0px; font-size: 20px;}2.分组选择器（1） 分组选择器：分组选择器不是一种选择器类型，而是一种选择器使用方法。当多个对象定义 了相同的...

一、css1.css是什么？CSS(Cascading Style Sheets)，层叠样式表。2.css的优点（1）使html专注于网页的内容，css专注于网页的表现 （2）提供了丰富的格式化功能 （3）可以针对各种可视化浏览器（主要有显示器、打印机、pda等）来设置不同的样式二、css的引入方式1.行内样式<div style="color:red;">内容</div>2.内嵌式 <style type="...

一、表单1.input基本属性（1）基本格式<input type="" name="" value="" placeholder="">（2）属性 ①type 类型type="text" 文本框 type="password" 密码框 type="radio" 单选框 name值必须保持一致 type="checkbox" 复选框 type="submit" 提交按钮 type="reset" 重置按钮 type="...

一、表格（续）1.合并单元格（1）colspan：水平合并单元格 colspan的值就是在水平方向所占单元格的数量<td colspan="">单元格</td>（2）rowspan：垂直合并单元格 colspan的值就是在垂直方向上所占单元格的数量<td rowspan="">单元格</td>二、表单1.表单是什么 表单是用来采集用户的输入数据，然后将数据提交给服务器2.表单的基...

一、超链接1.超链接是什么通过使用超链接，各个不同的网页就可以相互的导航和跳转插入超链接的标签。2.超链接的基本结构：<a></a><a href=""></a>通过使用属性href（hypertext reference）来指定要链接的url，标签的内容可以为文本也可为图片等其他标签（1）链接到网址：<a href="网址">跳转网页</a><a href="http://www.baidu.co

一、图片标签属性：src ：用来引入图片路径 alt ：当图片加载失败时的提醒文本（在网络较慢的环境中，如果没有出现图片，那么将以图 片替代文本显示） width ：图片的宽度 默认单位：像素px height ： 图片的高度 默认单位：像素px title ： 鼠标放到该标签上的提醒文本（注：多数标签都有此属性，但浏览器的支持不全面） <img src="1.jpg" alt="稍等一下，正在加载哦~~~" width="100px" heig...

一、关于HTML HTML（HyperText Markup Language）即超文本标记语言，是一种用来制作超文本文档的简单标记语言，也是制作网页的最基本的语言，它可以直接由浏览器执行。二、知识点总结1.五大常见浏览器:Internet Explorer、FireFox、Safari、Chrome、Opera。2.段落标签 <p>内容</p><p>这是内容</p>3.HTML:超文本标记语言4.网页状态下，按F12打...