发表于: 2019-06-15 23:21:21

1 836


今日完成:1  将任务八整体已基本完成

                  2  了解并实践了display:table;属性

                  3   了解并实践了页面悬浮的操作

今日收获:1  display:table;属性;

给HTML元素指定与表格相关的display属性值,使得它们像表格元素那样渲染。以下是这些可用的display属性值:

table
使该元素按table样式渲染
table-row
使该元素按tr样式渲染
table-cell
使该元素按td样式渲染
table-row-group
使该元素按tbody样式渲染
table-header-group
使该元素按thead样式渲染
table-footer-group
使该元素按tfoot样式渲染
table-caption
使该元素按caption样式渲染
table-column
使该元素按col样式渲染
table-column-group
使该元素按colgroup样式渲染


当时看到psd图的时候就在在想,这个跟表格实在是太像了,但是我之前看过表格布局的

介绍,都不推荐大家使用,毕竟已经落伍了 ,然后在百度的时候发现用css也可以实现,确实方便

而且不用直接声明display:table;直接用display:row就可以直接用了


2关于任务中的悬浮:主要就是三点  :

                  1  display:none,直接使页面消失,然后通过hover点击  display:block即可实现页面的消失和重现

                  2   底层元素设为relative,表层设为absolute.

                        如果底层盒子不设置为relative,那么表层元素则会直接以body为盒子绝对定位


                   3   将top,left right   bottom设为0即可实现铺满底层盒子,如果有任何一个不为0,或者不设置为0,

                                   那么表层盒子就会以内容来判断自身大小

                  当然最重要的还是多查浏览器,浏览器基本上可以解决目前所有的问题




返回列表 返回列表
评论

    分享到