background,position,绝对定位中位置属性的定位规则,cursor
backgorund背景
- background-color:red; 背景颜色
- background-image:url(路径);背景图片
- background-repeat:no-repeat;不重复
- background-repeat:repeat-x/y;x轴上重复
- background-position:right bottom;右下角 [top center] 上边中间
- background-position:50% 50%; [20px 70px;]
- background:red url() no-repeat 100px 100px;
- background-attachment:fixed; 固定定位 (相对于浏览器)
- bancground-position:0(y右移) 50px(下移);[center top]背景精灵时
只让背景透明 文字不透明
- 可以使用rbga,如:background:rgba(0,0,0,0.3);
- 最后一个值是透明度,范围0到1,
- 前3个是rgb的颜色值。
position定位
- fixred固定定位
- 当元素是固定定位时:四个方位属性,是依据浏览器的四条边进行定位
- top:; left:; bottom:; right:;有了定位属性才有这四个属性
- relative
- absoulute
- z-index:;
- 当层级相同时后写的在上边 层级大的在上边
- 如果两个元素是非父子元素时,层级高的在上方
- 如果两个元素是父子元素时,子元素在上方
绝对定位中位置属性的定位规则
- 看父元素有没有定位属性,若有,依据父元素四条边定位,若没有参考第二条;
- 看父元素的父元素有没有定位属性,若有,依据父元素的父元素的四条边进行定位,若没有,参考第三条;
- 继续一层一层网上找,一直找到有定位属性的父元素,或者是html的根元素,依据四条边定位。
- 无论是浮动还是定位,本质上说,对内部元素没有影响
cursor
- pointer手型
- wait等待
background,position,绝对定位中位置属性的定位规则,cursor的更多相关文章
- Android UI: LinearLayout中layout_weight 属性的使用规则
首先来查看android sdk文档,有这么一段话 LinearLayout also supports assigning a weight to individual children with ...
- 0029 定位:position(相对、绝对、固定、绝对定位盒子居中、z-index、绝对定位改变display属性)
目标 理解 能说出为什么要用定位 能说出定位的4种分类 能说出四种定位的各自特点 能说出我们为什么常用子绝父相布局 应用 能写出淘宝轮播图布局 1. CSS 布局的三种机制 网页布局的核心 -- 就是 ...
- css中的position:relative和absolute 属性
语法: position : static | absolute | fixed | relative 取值: static :默认值.无特殊定位,对象遵循HTML定位规则 absolute :将对象 ...
- CSS笔记(十)position属性与定位
参考:http://www.w3school.com.cn/cssref/pr_class_position.asp position属性规定了元素的定位类型.任何元素都可定位,其中,绝对或固定元素会 ...
- css中的大小、定位、轮廓相关属性
css中的大小.定位.轮廓相关属性 1.通过height.width属性控制组件大小 height:高度,可以设置任何有效的距离值: width:宽度,可以设置任何有效的属性值: max-height ...
- js中scrollLeft、scrollWidth、offsetTop等相关位置属性的理解(转)
1.常见的事件位置属性 e.pageX——相对整个页面的坐标 注意:IE6.IE7.IE8无该属性 e.layerX——相对当前坐标系的border左上角开始的坐标 注意:在opera.IE6.IE7 ...
- 在使用element-ui搭建的表格中,实现点击"定位"按钮后,屏幕滚动到对应行的位置
背景: 一个后台管理系统,当管理员登录之后,会存在一个自己的id值, 在一个表格中,当点击"定位"按钮后,屏幕滚动到拥有管理员id的这一行,并且给设置一个高亮的背景 相关知识点: ...
- LinearLayout的gravity属性以及其子元素的layout_gravity何时有效;RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制,用RelativeLayout中的gravity无法控制!!!
LinearLayout的gravity属性以及其子元素的layout_gravity何时有效:RelativeLayout如何调整其子元素位置只能用子元素中的属性来控制,用RelativeLayou ...
- js中的位置属性
原生js中位置信息 clientLeft,clientTop:表示内容区域的左上角相对于整个元素左上角的位置(包括边框),实测,clientLeft=左侧边框的宽度,clientTop=顶部边框的宽度 ...
随机推荐
- HTML的优化
HTML的优化 : 1).h标签的使用: 要注意的是,不论任何页面,h1标签只能出现一次,它是当前页面的主标题,权重最高, 所以要慎用 . 一般情况下,如果有关键词的话最好是在h1里面出现. h2是表 ...
- SuperSocket主动从服务器端推送数据到客户端
关键字: 主动推送, 推送数据, 客户端推送, 获取Session, 发送数据, 回话快照 通过Session对象发送数据到客户端 前面已经说过,AppSession 代表了一个逻辑的 socke ...
- 用CSS画平行四边形
<div class="jx">我是一个平行四边形</div> <style> .jx{ //定义div的高度宽度 transform:skew ...
- Activiti7工作流+SpringBoot
文章目录 一. Activiti相关概念 1. Activiti介绍 2. 核心类 2.1 ProcessEngine 2.2 服务(Service)类 2.2.1 TaskService 2.2.2 ...
- Vue进阶
组件深入 过渡&动画 可复用性&组合 工具&规模化&内在 ****************参考*************** vue官方教程
- Python--day62--使用Bootstrap样式的出版社
没有使用之前: 使用Bootstrap样式之后:
- SQL2008 R2安装完成后开启services服务指引和 sa账号启用、数据类型
- H3C 传递信息(续)
- Java开发之快捷键
1.显示桌面快捷键:win+D或者右击状态栏,选择显示桌面. 2.UE编辑器:如果想把多行记录合并为一行,使用替换(Ctrl+R),查找里输入^p(代表回车换行符),替换为里什么都不填,替换位置选择所 ...
- P1047 汉诺塔
题目描述 汉诺塔是根据一个印度传说形成的数学问题:有三根杆子A, B, C, A杆上有n个穿孔圆盘, 盘的尺寸由下到上依次变小. 要求按照下列规则将所有圆盘移至C杆: 每次只能移动一个圆盘 大盘不能叠 ...