发表于: 2019-03-06 21:20:03

1 878


今天完成的事情:

今天把任务七的第二个网页制作出来了

明天计划的事情: 

明天准备把任务七的第三个网页做出来。然后在了解一下超链接,如果还有时间的话,就试着把任务3做完
遇到的问题:hover我应用

:link,:visited,:hover,:active这4个伪类大家都不陌生,4个伪类要按照LvHa这个爱恨原则来排(外国友人起的记忆方法),不然有些效果会出问题。

收获:进一步了解了hover的知识

任务五总结

任务耗时2天

任务总结:任务五主要就是固定定位实现滚动页面。还要运用背景插入。还有就是border边框。最下面还要运用一点圆角的知识。还有一点就是改变文字的颜色以及大小。这就是任务五里面需要主要注意的,其他的问题都很简单,这些了解了,任务五很轻松就能坐下来

深度思考

1.css可以绘制哪些常见的特殊形状?

正方形,长方形,菱形,平行四边形,梯形

2.如何理解vertical-align与line-height?  

1.line-height基本概念

定义:行高是指文本行基线baseline之间的垂直距离

1.1 line-height属性可赋值

设置固定长度(px,rem等固定单位)

设置数字:设置数字,此数字会与当前的字体尺寸相乘来设置行间距。

设置百分比:基于当前字体尺寸的百分比行距

注意:数字可以直接被继承,然后在计算行高,而百分比是先计算出行高,在以px继承

2.vertical-align基本概念与应用

定义:使行内元素的基线相对于该元素所在行的基线的垂直对齐

默认值baseline:元素基线与父元素基线对齐

众所周知,vertical-align支持很多属性值;(关键字值:vertical-align等等: middle;长度值:vertical-align: 4px等等;百分比值:vertical-align: 10%...等等)

注意:vertical-align的百分比值不是相对于字体大小或者其他什么属性计算的,而是相对于line-height计算的。

3.请解释一下CSS3的Flexbox(弹性盒布局模型)以及适用场景?

flex 是 Flexible Box 的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。 任何一个容器都可以指定为 Flex 布局。块级元素只需要display属性为flex即可。行内元素也可以使用 Flex 布局。.box{ display: inline-flex; }。Webkit 内核的浏览器,必须加上-webkit前缀

该布局模型的目的是提供一种更加高效的方式来对容器中的条目进行布局、对齐和分配空间。这种布局方式在条目尺寸未知或动态时也能工作。

4.title与h1、b与strong、i与em、img的alt与title、src与href有什么区别

title与h1的区别: 
定义:title是网站标题,h1是文章主题

作用:title概括网站信息,可以直接告诉搜索引擎和用户这个网站是关于什么主题和内容的,是显示在网页Tab栏里的;h1突出文章主题,面对用户,更突出其视觉效果,指向页面主体信息,是显示在网页中的

b与strong,i与em的区别: 
但从视觉上效果观看b与strong、i与em是没有区别的,唯一区别是搜索引擎检索的时候搜索引擎可以识别strong、em标签、而不能识别b与i标签

建议:为了符合CSS3的规范,b应尽量少用而改用strong ,i应尽量少用而改用em

img中的alt与title属性区别: 
alt属性是在你的图片因为某种原因不能加载时在页面显示的提示信息,它会直接输出在原本加载图片的地方

title属性是在你鼠标悬停在该图片上时显示一个小提示,鼠标离开就没有了,有点类似jQuery的hover

src与href的区别: 

href,.是超文本引用,指向需要连结的地方,是与该页面有关联的,是引用。在 link和a 等元素上使用。 

src是指向物件的来源地址,是引入。在 img、script、iframe 等元素上使用 

src通常用作“拿取”(引入),href 用作 “连结前往”(引用)

5.如何使用IconFont?

  1. 登录http://www.iconfont.cn/ 阿里巴巴矢量图标库,github或微博登录
  2. 选择喜欢的图标添加入库
  3. 然后点击右侧购物车,点击最下面的‘下载代码’按钮,下载保存到本地,解压即可得到需要的文件

6.HTML中dl、ul、ol用哪个比较好? 

(1)背景介绍:

什么是dl标签

dl标签就是定义列表,英文的单词是 definition list

接下来还有definition title  dt  列表的标题 这个标签是必须要的

definition description 列表的列表项,如果不需要它,可以不加 dd

就是说,dt、dd只能在dl里面;dl里面只能有dt、dd。

什么是ul标签

无序列表 unordered list,“无序列表”的意思。

无序列表中的每一项是li标签

li:list item,“列表项”的意思。

什么是ol标签

有序列表ol 英文单词:Ordered List。

里面的每一项都是li标签

(2)知识剖析:

列表

dl标签的作用非常大,在很多的大型网站上面都用它

上图可以看出,定义列表表达的语义是两层:

(1)是一个列表,列出了几个dd项目

(2)每一个词儿都有自己的描述项。

ul标签

li不能单独存在,必须包裹在ul里面;反过来说

ul的“儿子”不能是别的东西,只能有li。

我们这里再次强调,ul的作用,并不是给文字增加小圆点的,

而是增加无序列表的“语义”的。

ol标签

和无序列表一样,有序列表也是可以嵌套的哦

ol和ul就是语义不一样,怎么使用都是一样的

ol里面只能有li,li必须被ol包裹。li是容器级



返回列表 返回列表
评论

    分享到