position和margin的绝对定位和相对定位
电脑桌面清理干净之后,果然快了很多,桌面上的东西会占用内存,导致电脑变慢,以前我看到表姐的电脑桌面堆满了东西,我就在心里默默的鄙视不懂玩电脑的人,现在我竟然也养成了这种坏毛病。。保存东西的时候放在桌面确实很方便快捷。
开场白是题外话,不知道标题拟得准不准确,前天工作中遇到一个问题,就是两个div共用一条线,而且中间这条线要随着左右两边的div变长或变短,这个问题让我束手无策,如下图:

后来领导教我解决了这个问题,代码如下:
<div class="box">
<div class="box1"></div>
<div class="box2"></div>
</div>
.box { width:800px; padding:20px;}
.box1 { float:left; width:200px; height:200px;border:1px solid #666; position:relative;}
.box2 { float:left; width:300px;height:300px;border:1px solid #666;margin-left:-1px;}
注意看后面红色css的部分,position:relative;和margin-left:-1px;同时使用,这让我有点晕,以前没碰到过。后来领导发了一篇文章让我看,我觉得写得不错,转载过来学习学习。
那篇转载的文章现在我看有些地方还是有点晕,概念有点模糊,我希望两个月之后我再回来看那篇文章,仰天长笑三声:啊哈哈!原来这么简单啊!!
position和margin的绝对定位和相对定位的更多相关文章
- position属性中的绝对定位和相对定位
absolute(绝对定位):1.如果没有父级DIV,则会根据浏览器原始点去定位,而且跟他相邻的DIV会忽略它,定位后则可用TRBL(top,right,bottom,left)去布局.注意:TRBL ...
- 3、第3课CSS块级、行内元素、绝对定位、相对定位、固定位置20150922
1.块级元素 A:特点: A.1默认显示在父标签的左上角 A.2块级元素默认占满一行(占满整个文档流) B:常见的块级元素 P h1--h6 ul li ol li div h ...
- css绝对定位、相对定位和文档流的那些事
前言 接触html.和css时间也不短了,但每次用div+css布局的时候心里还是有点儿虚,有时候干脆就直接用table算了,很多时候用div会出现些不可预料的问题,虽然花费一定时间能够解决,但总不是 ...
- 【CSS】绝对定位和相对定位
html:定位层 特点: >>完全脱离默认文档流,独立于立体层面的Z轴之上. >>和float浮动一样都脱离了默认文档流,但float元素与默认文档流之间会相互产生影响,而定位 ...
- [Web 前端] 019 css 定位之绝对定位与相对定位
1. 关于定位 我们可以使用 css 的 position 属性来设置元素的定位类型 postion 的设置项如下 设置项 释义 relative 生成相对定位元素元素所占据的文档流的位置不变元素本身 ...
- 关于HTML中,绝对定位,相对定位的理解...(学习HTML过程中的小记录)
关于HTML中,绝对定位,相对定位的理解...(学习HTML过程中的小记录) 作者:王可利(Star·星星) HTML中 相对定位:position:relative; 绝对定位:position ...
- Javascript 绝对定位和相对定位
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- css中绝对定位和相对定位的区别
先说个技巧一般用:子绝父相,即相对定位是给父级的,绝对定位的时候是给子级的. 一:绝对定位 position: absolute;绝对定位:绝对定位是相对于元素最近的已定位的祖先元素(即是设置了绝对定 ...
- css中绝对定位和相对定位详解
相对定位relative和绝对定位absolute 相对定位 相对定位是标签在根据没加position样式前的位置来定位不会受父级标签的定位的影响,并且定位后不会脱离文本流,会占据原来的位置. 接下来 ...
随机推荐
- DevExpress v17.2新版亮点—ASP.NET篇(三)
用户界面套包DevExpress v17.2终于正式发布,本站将以连载的形式为大家介绍各版本新增内容.本文将介绍了DevExpress ASP.NET v17.2 的GridView Control. ...
- 神经网络损失函数中的正则化项L1和L2
神经网络中损失函数后一般会加一个额外的正则项L1或L2,也成为L1范数和L2范数.正则项可以看做是损失函数的惩罚项,用来对损失函数中的系数做一些限制. 正则化描述: L1正则化是指权值向量w中各个元素 ...
- 如何使用firebug
什么是Firebug 从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求.要写出漂亮的HTML代码:要编写精致的CSS样式表展示每个页面模块:要调试javascript给页面增加一些 ...
- magento模板 -- 如何安装magento模板
在magento下面安装模板首先要了解magento的模板结构: 每个magento模板都包含如下的类似结构: --app/design/frontend/default/[模板名称] ------- ...
- Android手机使用广播监听手机收到的短信
我们使用的Android手机在收到短信的时候会发出一条系统广播.该条广播中存放着接收到的短信的详细信息.本文将详细介绍如何通过动态注册广播来监听短信. 注册广播有两种方式,一种是动态注册,另一种是静态 ...
- CTF-练习平台-Misc之 Linux基础1
十四.Linux基础1 下载打开文件,解压后发下是一个没有后缀名的文件,添加后缀名为txt,搜索关键词“KEY”,发现flag Linux???不存在的!
- 控制input只输入数字--- onkeyup="value=value.replace(/[^\d]/g,'')"
☆ <td><input type="text" class="spInput" onkeyup="value=value.repl ...
- 关于springmvc 返回json数据null字段的显示问题-转https://blog.csdn.net/qq_23911069/article/details/62063450
最近做项目(ssm框架)的时候,发现从后台返回的json(fastjson)数据对应不上实体类,从数据库查询的数据,如果对应的实体类的字段没有信息的话,json数据里面就不显示,这不是我想要的结果,准 ...
- poj 2449 Remmarguts' Date(K短路,A*算法)
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/u013081425/article/details/26729375 http://poj.org/ ...
- lseek成功但未生效?
如果open打开文件时,指定了O_APPEND,即“追加”模式,那么lseek的向前移动指针的操作无法凑效,包括lseek(fd, 负数, SEEK_CUR)和lseek(fd, 小于当前偏移的位置, ...