CSS定位小技巧
CSS定位
Static 默认定位
Relative 相对定位:left 和top
position: relative;/*相对定位*/
left:40px;/*在原来的位置向右移动*/
top:100px;/*在原来的位置向下移动*/
他的参照点是他原来位置
Absolute 绝对定位:元素从原来的位置脱离,让出原来的空间,同时相对于他所
存在的离自己最近的非标准流的盒子而言的
position: absolute;/*绝对定位*/
left:40px;/*在原来的位置向右移动*/
top:100px;/*在原来的位置向下移动*/
他的参照点是他原来位置
Fixed 只根据body的绝对定位
CSS定位小技巧的更多相关文章
- css样式小技巧
1.css样式小技巧 HTML怎样设定使背景图片不随页面滚动而滚动 background-attachment:fixed; 2.实现li a 超过长度内容出现省略号… overflow:hidden ...
- css的小技巧
前几天看到<css揭秘>这本书,第一感觉是 css怎么能出这么厚的一本书,不过 细细一想,用好css真的可以实现很多想要的效果,节省很多js代码. 总结几个css的小技巧: 1,将所有元素 ...
- 第八十四节,css布局小技巧及font-awesome图标使用
css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...
- CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅
首页 登录注册 CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅 阅读 8113 收藏 927 2017-09-26 原文链接:github.com 腾讯云容器服务CSS,立 ...
- html/css/js小技巧实例
一些学习中碰到的小技巧 让div自动撑起来: .clearfix:after{ content: "."; clear: both; display: block; visibil ...
- 一些常用的html/CSS效果---小技巧
我常用的重置样式表reset.css /*===============基础信息================*/ *{border: 0;padding: 0;margin: 0;} table ...
- CSS调试小技巧 —— 调试DOM元素hover,focus,actived的样式
最近学习html5和一些UI框架,接触css比较多,就来跟大家分享一下css中的一些调试技巧.之前做页面,css都是自己写的,所以要改哪里可以很快的找到,现在使用了UI框架,里面的样式是不可能读完的, ...
- CSS设置小技巧
水平居中 对于元素的水平居中,有三种情况: 行内元素(文字.图片等):text-align: center; 定宽块状元素(有设置宽度的block元素):margin: 0 auto; 不定宽块状元素 ...
- 【温故知新】——CSS黑魔法小技巧可以少些不必要的js
前言:这篇文章是转载[前端开发博客]的一篇技术文章,并非本人所写.只是个人觉得很实用,所以分享给大家.原文链接:github.com 1.利用 CSS 的 content 属性 attr 抓取资料需求 ...
随机推荐
- Revit 二次开发 (二) 倾斜的板
在Revit二次开发过程中,建立一个倾斜的板是可以通过如下方法进行的: // // 摘要: // Creates a slab within the project with the given ho ...
- oracle的面试问题
1. Oracle跟SQL Server 2005的区别? 宏观上: 1). 最大的区别在于平台,oracle可以运行在不同的平台上,sql server只能运行在windows平台上,由于windo ...
- Android多线程通信之Handler
主线程 public class MainActivity extends ActionBarActivity { private Handler handler; // private Thread ...
- Connection termination(by client)” 错误的处理方法
背景: 在一些项目,当我们使用LR录制脚本的时候,在我们安装认证我们无法启动[网址= ] HTTPS [/url]的IE插件,页面显示空白,没有事件的记录,在Firefox也一样. 在记录日志,我们会 ...
- WM_SETFOCUS和WM_KILLFOCUS、WM_GETDLGCODE、CM_ENTER...
procedure WMSetFocus (var Message: TWMSetFocus); message WM_SETFOCUS; //获得焦点 procedure WMKillFocus ( ...
- 160913、ionic + 高德地图定位
实例一: var AMapArea=document.getElementById('amap'); AMapArea.parentNode.style.height="100%" ...
- Linux workqueue工作原理 【转】
转自:http://blog.chinaunix.net/uid-21977330-id-3754719.html 转自:http://bgutech.blog.163.com/blog/static ...
- linux中的优先搜索树的实现--prio_tree【转】
转自:http://blog.csdn.net/bailyzheng/article/details/8041943 linux中的优先搜索树的实现--prio_tree prio_tree在linu ...
- [转]微软SerialPort秘籍[SerialPort为什么死锁程序的分析]
既然是秘籍,显然是写一些大家不常找到的,MSDN里遗漏提示大家注意的东西. 用过.net 2.0中,自带SerialPort的人,大多都遇到过.莫名其妙的执行Close的时候会死掉的问题.而Wince ...
- ios tabbar 文字位置
[nav.tabBarItem setTitlePositionAdjustment)];