ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

定位及背景属性

2019-08-21 22:50:33  阅读:159  来源: 互联网

标签:定位 repeat center 父级 背景 backgroud 属性


定位的属性
position
relative 相对定位
使用top left bottom, 可以实现相对位置的偏移

absolute 绝对定位
元素会脱离文档流
其实就是相对于body的定位
如果父级设置了定位属性 本元素会相对于父级进行定位

fixed 固定定位
不管父级有没有定位 都相对于浏览器窗口定位

inherit 继承 父级的定位属性

opacity : 透明度 0.5 一般的透明度


定位的层级
默认后面写 会排在上面
z-index : 设置层级 数字越大 越在上面

悬浮菜单栏
用固定定位 可以实现悬浮菜单

相对于浏览器水平居中的悬浮浏览框

 

背景属性

 

背景属性
backgroud-color :颜色

 

backgroud-image :背景图片 url(图片地址)

 

backgroud-repeat : 北极图片如何重复平铺
repeat-x : 只重复x轴
repeat-y : 只重复y轴
no-repeat : 只平铺一次
repeat : 平铺所有的

 


backgroud-position :设置背景图片位置
left top :左边的上面 默认
center center :居中

水平 left center right
垂直 top center bottom
以此类推 共9种

10px 20px 按照右上为原点 +xpx 为位置

 

backgroud-attachment : 设置背景图片是随页面滚动还是固定
fixed 固定

 


合并的写法为 :
例 : backgroud : url(image/bg.jpg) -20px 10px no-repeat cyan;
图片 位置 平铺次数 颜色

 

标签:定位,repeat,center,父级,背景,backgroud,属性
来源: https://www.cnblogs.com/fuyi2345/p/11391742.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有