发表于： 2019-03-01 22:16:15
1 818
今天完成的事情：
昨天晚上由于电脑出了点问题重装系统了，今天上我在配置电脑，下午着手做任务7、第二张页面马上完成
明天计划的事情：
争取完成任务7，多看看以前的基础知识
遇到的问题：
雪碧图的运用，还没有思路，还有就是单位一直习惯用px,百分比，vw，rem的属性值有点忘了，要赶紧预习一下。
收获：
1.vw：1vw等于视口宽度的1%。
2.vh：1vh等于视口高度的1%。
3.vmin：选取vw和vh中最小的那个。
4.vmax：选取vw和vh中最大的那个。
vh and vw：相对于视口的高度和宽度，而不是父元素的（CSS百分比是相对于包含它的最近的父元素的高度和宽度）。1vh 等于1/100的视口高度，1vw 等于1/100的视口宽度。
比如：浏览器高度950px，宽度为1920px, 1 vh = 950px/100 = 9.5 px，1vw = 1920px/100 =19.2 px。
vmax相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax。
vmin相对于视口的宽度或高度中较小的那个。其中最小的那个被均分为100单位的vmin。
任务四总结；
任务四的任务就是登录页，做一个最常见的移动端页面，首先就是要是要利用ps切图工具吧需要的图片切出来，然后就是布局问题，头部harder这是最基本的书写规范，重要的就是布局问题，我们要了解行内元素与块级元素的区别，行内元素对应display：inline，块级元素对应display：block，块级元素独自占一行且宽度会占满父元素宽度，行内元素不会独占一行，相邻行内元素可以排在同一行，提示：该属性不是必需的，但是我们认为您应该始终使用它。关于 input标签的运用还有他是用来做什么的。type 属性规定要显示的 <input> 元素的类型
语法；
<input type="value">还有就是button属性的含义。定义可点击的按钮（通常与 JavaScript 一起使用来启动脚本），现在可以简单了解一下。
深度思考；
第一elative, absolute, fixed 的区别是什么?
static（静态定位）：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。
2、relative（相对定位）：生成相对定位的元素，通过top,bottom,left,right的设置相对于其正常（原先本身）位置进行定位。可通过z-index进行层次分级。
3、absolute（绝对定位）：生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
4、fixed（固定定位）：生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
第二标签input的运用？
可以用这个属性实现选择框，
单选框：
<body> <input type="radio" name="sex" value="n" /> <input type="radio" name="sex" value="v" /></body>
第三css怎么控制文本输入框？
首先控制输入框的大小，diamagnetic如下；
input{width:100px;height:30px;line-height:30px;}
宽度为100像素，高度为30像素
然后控制input只能输入文字并限制长度和大小：
第四怎么限制长度（字符数）
<input type="number" oninput="if(value.length>11)value=value.slice(0,11)" />
限制大小（最大值、最小值）
限制最大值30
<input type="number" oninput="if(value>30)value=30" />
第五怎么限制最小值0
<input type="number" oninput="if(value<0)value=0" />
联合限制（限制长度和大小）
//长度2 最大值30 最小值0
<input type="number" oninput="if(value>30)value=30;if(value.length>2)value=value.slice(0,2);if(value<0)value=0" />
第六怎么使输入密码？
语法：
<form>
<input type="text/password" name="名称" value="文本" />
</form>
1、type：
当type="text"时，输入框为文本输入框;
当type="password"时, 输入框为密码输入框。
2、name：为文本框命名，以备后台程序ASP 、PHP使用。
3、value：为文本输入框设置默认值。(一般起到提示作用)
举例：
<form>
姓名：
<input type="text" name="myName">
<br/>
密码：
<input type="password" name="pass">
</form>
语法：
<form>
<input type="text/password" name="名称" value="文本" />
</form>
1、type：
当type="text"时，输入框为文本输入框;
当type="password"时, 输入框为密码输入框。
2、name：为文本框命名，以备后台程序ASP 、PHP使用。
3、value：为文本输入框设置默认值。(一般起到提示作用)
举例：
<form>
姓名：
<input type="text" name="myName">
<br/>
密码：
<input type="password" name="pass">
</form>
任务耗时一天
返回列表
评论