CSS定位
Static 默认定位
Relative 相对定位:left 和top
position: relative;/*相对定位*/
left:40px;/*在原来的位置向右移动*/
top:100px;/*在原来的位置向下移动*/
他的参照点是他原来位置
Absolute 绝对定位:元素从原来的位置脱离,让出原来的空间,同时相对于他所
存在的离自己最近的非标准流的盒子而言的
position: absolute;/*绝对定位*/
left:40px;/*在原来的位置向右移动*/
top:100px;/*在原来的位置向下移动*/
他的参照点是他原来位置
Fixed 只根据body的绝对定位

CSS定位小技巧的更多相关文章

  1. css样式小技巧

    1.css样式小技巧 HTML怎样设定使背景图片不随页面滚动而滚动 background-attachment:fixed; 2.实现li a 超过长度内容出现省略号… overflow:hidden ...

  2. css的小技巧

    前几天看到<css揭秘>这本书,第一感觉是 css怎么能出这么厚的一本书,不过 细细一想,用好css真的可以实现很多想要的效果,节省很多js代码. 总结几个css的小技巧: 1,将所有元素 ...

  3. 第八十四节,css布局小技巧及font-awesome图标使用

    css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...

  4. CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅

    首页   登录注册         CSS 黑魔法小技巧,让你少写不必要的JS,代码更优雅 阅读 8113 收藏 927 2017-09-26 原文链接:github.com 腾讯云容器服务CSS,立 ...

  5. html/css/js小技巧实例

    一些学习中碰到的小技巧 让div自动撑起来: .clearfix:after{ content: "."; clear: both; display: block; visibil ...

  6. 一些常用的html/CSS效果---小技巧

    我常用的重置样式表reset.css /*===============基础信息================*/ *{border: 0;padding: 0;margin: 0;} table ...

  7. CSS调试小技巧 —— 调试DOM元素hover,focus,actived的样式

    最近学习html5和一些UI框架,接触css比较多,就来跟大家分享一下css中的一些调试技巧.之前做页面,css都是自己写的,所以要改哪里可以很快的找到,现在使用了UI框架,里面的样式是不可能读完的, ...

  8. CSS设置小技巧

    水平居中 对于元素的水平居中,有三种情况: 行内元素(文字.图片等):text-align: center; 定宽块状元素(有设置宽度的block元素):margin: 0 auto; 不定宽块状元素 ...

  9. 【温故知新】——CSS黑魔法小技巧可以少些不必要的js

    前言:这篇文章是转载[前端开发博客]的一篇技术文章,并非本人所写.只是个人觉得很实用,所以分享给大家.原文链接:github.com 1.利用 CSS 的 content 属性 attr 抓取资料需求 ...

随机推荐

  1. Portal Page的呈現

    先看一下在JSR168中提到的Portal page,可以了解一個Portal Page上大概有哪些element: OK...進入本次主題 PSML:PSML的全名是Portal Structure ...

  2. listview中item 有checkbox多选防止滑动 listview页面 出现checkbox错位问题

    checkbox点击切换背景 <CheckBox android:id="@+id/checkbox" android:layout_width="40dp&quo ...

  3. Windows cmd 颜色,字体,color font set up

    windows的cmds默认的字体很丑,丑的不认直视,『如花』一般. 但是总有用到的时候 这是我有优化的一种结果,怎么来弄呢 要字体颜色漂亮,先要在注册表的Console中注册你要使用的字体,这个至关 ...

  4. java简单的数据库查询(SQLServer数据库)

    1.数据库链接类 import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException; pu ...

  5. C# 控制连接超时

    首先连接超时分为三种,TCP Connection to SQL Server -> SqlConnection.Open -> SqlCommand.Execute先说第二种超时,sql ...

  6. HttpContext.Current.Cache在控制台下不工作

    说明: Cache 类不能在 ASP.NET 应用程序外使用.它是为在 ASP.NET 中用于为 Web 应用程序提供缓存而设计和测试的.在其他类型的应用程序(如控制台应用程序或 Windows 窗体 ...

  7. 创建sh文件

    创建sh文件 #/bin/bash v_file=$ v_type=$ v_desc=$ touch $v_file echo '#================================== ...

  8. Mysql query log

    一.查询日志的概念: 查询日志记录MySQL中所有的query,通过"--log[=file_name]"来打开该功能.由于记录了所有的query,包括所有的select,体积比较 ...

  9. snackbar初体验

    底部弹出的部分就是snackbar的,右侧可添加一个action响应点击事件,遗憾的时貌似只能添加一个 这是华为mate8上面运行出来的效果,颜色之类的都是默认.不同的android版本样式稍有差异 ...

  10. python-django 模型model字段类型说明

    V=models.CharField(max_length=None<, **options>) #varchar V=models.EmailField(<max_length=7 ...