CSS----层级、背景图片,表格

如果定位元素的层级是一样,则下边的会盖住上边的。

通过z-index属性可以用来设置元素的层级,可以为z-index指定一个正整数作为值,该值会作为当前元素的层级,层级越高,越优先显示。

没有开启定位的元素不能使用z-index

设置元素透明背景:

         opacity:0 表示完全透明

                        1 表示完全不透明

                        0.5 表示半透明

         alpha(opacity=透明度): 0 表示完全透明

                                                      100 表示完全不透明

                                                       50 表示半透明

开启相对定位,父元素的层级再高,也不会盖住子元素

position:relative;

开启相对定位

position:absolute;

背景:background-image:url(相对路径);

background-repeat     用来设置背景图片的重复方式,可选值:

            repeat:默认值,背景图片会双方向重复(平铺)

           no-repeat:背景图片不会重复,有多大就显示多大

           repeat-x:沿水平方向重复

           repeat-y:沿垂直方向重复

background-position    调整背景图片在元素中位置,可选值:

           top     right     left     bottom    center

background-attachment        用来设置背景图片是否随页面一起滚动,可选值:

           scroll:默认值

           fixed:背景图片会固定在某一位置,不随页面滚动

                       定位永远相对于浏览器的窗口

不随窗口滚动的图片,一般都设置给body,不设置给其他元素

表格:table标签 创建一个表格

           tr 表示表格中的一行

           rowspan 用来设置纵向的合并单元格

           colspan 用来设置纵向的合并单元格

tabletr边框之前默认有距离,通过border-spacing属性设置这个距离

border-collapse可以用来设置表格的边框合并, 如果设置了边框合并,则border-spacing自动失效

            th标签来表示表头中的内容

长表格:分为三部分:thead 表头

                                    tbody 表格的主体

                                    tfoot 表格底部




就算跌倒,也要豪迈的笑

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容