发表于: 2018-08-21 21:10:35
1 613
今天完成的事情:
提交了任务4,在做任务4时我用到了用ps上面工具找到资源的颜色,用到了盒子模型的边距,内边距,边框,用浮动把我的图片浮动到左边,用type="text"在百度找到的代码解决了,输入框的问题。
用 父元素与子元素,给父元素一个高,给子元素一个行高,然后使元素垂直居中,用一个大的div包住几个元素的方法使他们在一行中。下载好了ps配置成功。虽然下载了多次而且没有成功,配置了一键切图,配置好了git并且,装好与github的链接,上传了任务4到github上。
明天计划的事情:开始任务5
遇到的问题:
ps多次下载失败,师兄给我传,还有百度的方法也用了,最后还是用管理员身份运行才成功。垂直居中,多次百度找方法,一个个的试,最后才实验出适合我的。
收获;又学习到了盒子模型加深了印象,又一次用到了浮动,学到了垂直居中,用父元素与子元素的方法,输入框学会了。
任务4总结
让让header紧贴顶部没有缝隙,我用了margin;0;的方法,使元素紧贴。学会了垂直居中用到了行高,
行高指的是文本行的基线间的距离。就是每行文字下边与下一行文字的下基线之间距离
水平居中就是使文字在这行、单元格、编辑范围内处在中间;垂直居中就是使文字在这列、单元格、编辑范围内处在中间。学到了垂直居中和水平居中,用到了垂直居中,垂直居中时会把除去元素的剩下面积,平分达到居中不会改变位置,适合各种浏览器。
脑图:
任务4深度思考:
1.position定位有哪几种?各有什么特点
4种
static
所有元素在默认的情况下position属性均为static。
其用法为:在改变了元素的position属性后可以将元素重置为static让其回归到页面默认的文档流中。
需要注意的是z-index属性在position为static的情况下无效。
relative
俗称的相对定位,重点在于对相对的理解。我们都知道每个元素在页面的文档流中会“占用”一个位置,这个位置可以理解为默认位置,而相对定位就是将元素偏离元素的默认位置,但文档流中依然保持着原有的默认位置,并没有脱离文档流,只是视觉上发生的偏移。
relative的特点
- 仍在文档流之中,并按照文档流中的顺序进行排列。
- 参照物为元素本身的位置。
设置relative最常用的目的为改变元素层级和设置为绝对定位的参照物。
absolute
俗称的绝对定位,绝对定位是相对而言的,怎么理解呢?应用了position: absolute的元素会通过相对于最近的非 static 定位的祖先元素的偏移,来确定元素位置。如果其祖先元素都没有设置过非 static 定位的属性时,则该元素最终将以 html 元素进行。
2.,其计算原则是什么?
top,right,bottom,left:全兼容,
height:基于包含它的块级对象的百分比高度。
width:基于包含它的块级对象的百分比宽度。
margin:百分数是相对于父元素的 width 计算的。
padding:百分数是相对于父元素的 width 计算的。
3.常见的表单元素有哪些?各有什么属性?
form:定义供用户输入的表单。
fieldset:定义域。即输入区加有文字的边框。
legend:定义域的标题,即边框上的文字。
label:定义一个控制的标签。如输入框前的文字,用以关联用户的选择。
input:定义输入域,常用。可设置type属性,从而具有不同功能。
textarea:定义文本域(一个多行的输入控件),默认可通过鼠标拖动调整大小。
button:定义一个按钮。
select:定义一个选择列表,即下拉列表。
option:定义下拉列表中的选项。
4.如何理解HTML结构的语义化?
你写的HTML结构,是用相对应的有一定语义的英文字母(标签)表示的,标记的,因为HTML本身就是标记语言。
5.使用fixed的时候,在手机上查看是否会有问题,怎么解决?
有 用f12找到问题改正。
评论