__x__(35)0908第五天__ 层级 z-index

【x(35)0908第五天__ 层级 z-index】的更多相关文章

x(35)0908第五天__ 层级 z-index

如果三个 div 全部设置 position: absolute; 绝对定位,且未设置 z-index, 则从代码结构上下面的元素会盖住上面的元素. z-index 层级: 通过 z-index 属性设置元素的层级. z-index : 正整数; 层级越高 ,越优先显示在最上面. z-index: 1; 大于没设置 z-index 的元素对于没有开启定位的元素,z-index 无效. 父元素层级再高,也不会盖住子元素.…

x(34)0908第五天__ 定位 position

position 定位指将原始摆放到页面的任意位置. 继承性:no 默认值:static 没有定位,原始出现在正常的文档流中可选值: static : 默认值,元素没有开启定位 relative : 开启元素的相对定位 absolute : 开启元素的绝对定位 fixed : 开启元素的固定定位,固定定位也是绝对定位的一种. 当开启 position 定位后,可以使用 left,top,right,bottom 进行偏移设置. 1. position…

x(29)0908第五天__高度塌陷问题

高度塌陷在文档流中,父元素的高度默认是被子元素撑开的. 但是当为子元素设置 float 时,子元素会完全脱离文档流,无法再撑开父元素,导致父元素高度塌陷...以致于布局混乱变成 BFC块级格式化环境根据 W3C 标准,元素都有一个隐含的属性 “Block Formatting Context” 该属性可以打开/关闭,默认是“关闭”. 当开启BFC后,元素将具有如下特性: 1. 父元素的垂直外边距不会和子元素重叠. 2. 不会被浮动元素所覆盖,会在浮动元素的旁边显示. 3. 可以包含浮…

x(30)0908第五天__导航条的练习 <div>版本

效果图: html源代码: <!doctype html> <html> <head> <meta charset="utf-8" /> <title>湖南城市学院</title> <link rel="stylesheet" type="text/css" href="css/hncu.css" /> </head> <b…

x(31)0908第五天__导航条的练习 <ul> 版本

效果图: html代码: <!doctype html> <html> <head> <meta charset="utf-8" /> <title>湖南城市学院</title> <link rel="stylesheet" type="text/css" href="css/hncu.css" /> </head> <bo…

x(35)0908第五天__opacity 透明度

opacity 透明度设置一个 0 - 1 之间的值. opacity: 0; 完全透明 opacity: 0.5 半透明 opacity: 1; 完全不透明缺点: IE8及以下都不支持 opacity . IE8及以下透明度 : filter: alpha(opacity=50); 此时,透明度 opacity 取 0-100 为了兼容所有浏览器,设置 div 为半透明 div{ opacity: 0.5; filter: alpha(opacity=50); }…

x(36)0908第五天__背景 background

1. 背景 background: red url(img/cat.gif) repeat-x fixed; 2. 背景颜色 background-color: red; 3. 背景图片 background-image: url(img/cat.gif); 如果图片大于元素,则会显示图片左上角部分. 如果图片和元素一样大,则会全部显示. 如果图片小于元素,则图片会 x 横向, y 纵向平铺铺满元素. 可以同时设置background-color,作为图片的底色. 4. 背景图片重复方式 …

x(40)0909第五天__表格 table 的 css 样式美化

如果就向下面的代码那样,不写 tbody , 则浏览器自添加 tbody , 并将所有的 tr 移入 tbody 意味着 tr 并非 table 的子元素,而是 tbody 的子元素. 所以以后编写代码,尽可能地写上 tbody,防止混淆. th 表头是特殊的 td “具有加粗,文字居中”的效果 . 为 table 添加边框: 1. 为 th,td 设置 border: 1px red solid; 2. 为 table 设置 /* 单元格之间的距离.*/ border-spacing: 0…

x(41)0909第五天__长表格

长表格银行流水,表格很长... 则需要将表格分为表头 thead ,主体数据 tbody , 表格底部 tfoot 三个标签无顺序要求,易于维护:thead → tfoot → tbody 如果没写 tbody ,浏览器会自添加 tbody,并将所有的 tr 移入 tbody 好处: 可以分别设置样式. 打印时,利用分类处理多页表头,表尾的效果. 无顺序要求,已维护. 效果图: css代码: @charset "utf-8"; *{ margin: 0px; padding: 0p…

x(32)0908第五天__Photoshop的基本操作

1. 设置 Photoshop 的单位为像素px 2. 标尺显示与隐藏 Ctrl + r 3. 放大与缩小 Ctrl + 1 放大到100% Ctrl + 0 适应屏幕 Alt + 鼠标滑轮 4. 查看矩形框选中目标的width和height F8 5. 辅助线 Ctrl + H 隐藏 / 显示 6. 前景色取色器取色…

【__x__(35)0908第五天__ 层级 z-index】的更多相关文章

【x(35)0908第五天__ 层级 z-index】的更多相关文章