css定位:相对定位

关于相对定位的结论如下
1. 使用相对定位的盒子,会相对于它原来的位置,通过偏移指定的距离,到达新的位置。
2.使用相对定位的盒子仍在标准流中,它对父块和兄弟盒子没有任何影响。

<html><head><meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /><title>无标题文档</title><style type=”text/css”>
body{margin:15px;font-family:Arial;font-size:12px;}.father{background-color:#ffff99;border:1px solid #000000;padding:20px;}.father div{background-color:#00ff00;padding:10px;border:1px dashed #000000;}#block2{}</style></head><body><div class=”father”><div>Box-1</div><div id=”block2″>Box-2</div><div>Box-3</div></div></body></html>

static(静态定位)为默认值,即在原本应该在的流布局上,从左到右,从上到下。

relative(相对定位),通过设置position属性为relative,在设置具体方向的偏移量来实现,top   left  right botton
修改代码如下,即可发现box-2偏移了,但对box-3没影响,
#block2{
 position:relative;
 left:30;
 top:20;
 }

转载于:https://www.cnblogs.com/epuoo/p/4164631.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/420396.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Vue warn: Invalid prop: type check failed for prop “data“. Expected Array, got Object.

需要数组&#xff0c;但是获取的是对象拉。 但是接口解析处理返回的是数组。 与下面的定义有关。我定义成了对象.png. 正解&#xff1a;

前端学习(1306):node.js模块的加载机制

demo10.js require(./find.js); find.js console.log(找到了); 运行结果

用nodejs 替换文件中所有图片的url

用nodejs 替换文件中所有图片的url 因业务需求&#xff0c;大量文件需要替换url到不同的环境。 所以用nodejs写了这个。本来想用python写&#xff0c;但是大部分同事只有nodejs环境。 主要的命令node rurl.js -new http://www.g.cn/ 替换原有.png .jpg图片图片路劲到 http://ww…

git bash上传大文件到github

git-lfs下载git lfs工具命令GitHub默认最高支持单次上传文件100MB git-lfs&#xff1a;git large file storage 下载git lfs工具 https://git-lfs.github.com/ 命令 在工作目录打开git bash。 # 1. 启用lfsgit lfs install# 2. 要上传的文件&#xff0c;这里指定目录下的…

Linux 命令快捷键

Linux 命令快捷键 tab 自动补齐(有不知道的吗)Ctrlu 删除(剪切)此处至开始所有内容 Ctrlk 删除从光标所在位置到行末 快速命令行 – 快捷方式• history 搜索历史执行过的命令• ctrll 清屏• Reset 刷新终端屏幕&#xff0c;尤其是终端出现字符不清晰或乱码时特管用 (和ctrl …

Git 分支创建并推送到现有仓库

推送方式 本地初始化仓库&#xff0c;创建分支&#xff0c;关联远程仓库&#xff0c;进行推送。 # 将当前目录交给Git管理 git init# 创建分支 dev # git branch dev # git checkout dev git checkout -b dev# 将代码上传本地仓库 git add .# 提交描述 git commit -m hhh# 与…

Oracle Explain Plan,hint解释与示例

Oracle 专业dba博客&#xff1a;http://blog.csdn.net/tianlesoftware Hint 是Oracle 提供的一种SQL语法&#xff0c;它允许用户在SQL语句中插入相关的语法&#xff0c;从而影响SQL的执行方式。因为Hint的特殊作用&#xff0c;所以对于开发人员不应该在代码中使用它&#xff0c…

docker 指定配置文件启动redis

redis启动1. 下载&#xff0c;修改redis.conf文件2. 指定配置文件启动3. 连接redis1. 下载&#xff0c;修改redis.conf文件 下载redis.conf wget http://download.redis.io/redis-stable/redis.conf修改配置 bind 127.0.0.1 # 注释掉这部分&#xff0c;这是限制redis只能本地…

UVa 10820 (打表、欧拉函数) Send a Table

题意&#xff1a; 题目背景略去&#xff0c;将这道题很容易转化为&#xff0c;给出n求&#xff0c;n以内的有序数对(x, y)互素的对数。 分析&#xff1a; 问题还可以继续转化。 根据对称性&#xff0c;我们可以假设x<y&#xff0c;当xy时&#xff0c;满足条件的只有(1, 1)。…

前端学习(1309):创建网站服务器

//创建网站服务器模板 const http require(http); //网站服务器对象 const app http.createServer(); //客户端有请求 app.on(request, (req, res) > {res.end(<h2>hello user</h2>) }); //监听端口 app.listen(3000); console.log(服务器启动成功); 运行结果…

javascript 异步加载 延时问题

异步加载可以理解为多线程加载。某个dom操作完成了&#xff0c;但是请求还在发送的路上。 等某个方法调用完成就行&#xff0c;延时调用即可。 // 下面是延时1s&#xff0c;向某个url发送请求。 setTimeout(() > {$.ajax({url: url,type: get,success: r > {console.lo…

前端学习(1310):http协议

请求 响应 //创建网站服务器模板 const http require(http); //网站服务器对象 const app http.createServer(); //客户端有请求 app.on(request, (req, res) > {//获取请求方式console.log(req.method);res.end(<h2>hello user</h2>) }); //监听端口 app.lis…

文件夹锁定(Source)

文件夹锁定&#xff08;Source&#xff09;private void Lock(string folderPath){ try { string adminUserName Environment.UserName;// getting your adminUserName DirectorySecurity ds Directory.GetAccessControl(folderPath); FileSystem…

openfeign调用 HttpServletRequest作为参数 报错..

debug1. 问题起因2. 问题分析3. 问题解决1. 问题起因 需要将业务数据放入HttpServletRequest的请求头里面。被调用的模块&#xff0c;rest接口设计是以HttpServletRequest作为 参数的。于是夫&#xff0c;秉信feign的接口设计必须和提供者参数一样。消费者调用feign接口&#…

delphi 第一个字符不能是小数点_元字符的详细解析

上一篇文章介绍了正则的用处以及正则中这些元字符的基本含义&#xff0c;但是如果我们只知道那些元字符的含义&#xff0c;不知道怎么使用和加以练习&#xff0c;那么对于正则我们还只是看见了门槛&#xff0c;并没有踏入&#xff0c;那么本篇文章就让我们迈起脚步正式走入正则…

前端学习(1311):请求报文

//创建网站服务器模板 const http require(http); //网站服务器对象 const app http.createServer(); //客户端有请求 app.on(request, (req, res) > {//获取请求方式//console.log(req.method);//获取请求地址//console.log(req.url);if (req.url /index || req.url /)…

hdu 1016

以前写过的&#xff0c;再贴出来看看。。。 素数环问题 预处理搜索 AC代码&#xff1a; #include <iostream> #include <cstdio> #include <cmath> #include <cstring> #include <string> #include <ctype.h> using namespace std; int ou…