一个div如何与另一个div底部对齐,方法有很多,比如使用绝对定位

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.div1 {
position:relative;
width: 270px;
height: 15px;
background-color:#F00;
margin:0px;
padding:0px;
}
.div2 {
position:absolute;
bottom:0px;
width: 200px;
border:5px solid #3CC;
background:#000;
}
</style>
</head> <body>
<div class="div1">
<div class="div2"></div>
</div>
</div>
</body>
</html>

一个div居于另一个div底部的更多相关文章

  1. css笔记:如何让一个div居于页面正中间

    如何让一个div居于页面中间,我今天说的是让一个div水平居中同时垂直居中,而不是简单的top:50%,left:50%.当然,我们就按一开始的思路写一下:top,left属性都设为50%,看一下效果 ...

  2. 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  3. 如何让一个div居于页面正中间

    如何让一个div居于页面正中间 如何让一个div居于页面中间,我今天说的是让一个div水平居中同时垂直居中,而不是简单的top:50%,left:50%.当然,我们就按一开始的思路写一下:top,le ...

  4. 点击一个div隐藏另一个div

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. DIV+CSS常见问题:DIV如何设置一个像素高度?

    CSS如何控制DIV实现1像素高度呢?问题看起来很简单,但万恶的IE6会让你很麻烦,不过解决办法很多,本文将介绍最简单的一种:DIV{height:1px;line-height:1px;font-s ...

  6. 每天一个JavaScript实例-从一个div元素删除一个段落

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  8. 一个div在另一个div中水平垂直的方法

    html <div id="main"> <div id="box"> 一个div在另一个div中垂直居中实现方法 </div&g ...

  9. JaveWeb 公司项目(1)----- 使Div覆盖另一个Div完成切换效果

    最近在做网页,用的是CSS+DIV的布局方法,搭建了一个简易的界面,大体上分为三个部分,如图所示: 左侧的为主功能导航栏,右侧是具体的功能实现,下方是固定的版权声明,单击左边不同的导航按钮,在div中 ...

随机推荐

  1. 六.随机神经网络Boltzmann(玻尔兹曼机)

    Hopfield网络具有最优计算功能,然而网络只能严格按照能量函数递减方式演化,很难避免伪状态的出现,且权值容易陷入局部极小值,无法收敛于全局最优解. 如果反馈神经网络的迭代过程不是那么死板,可以在一 ...

  2. 为什么DW的可视化下看到的效果与浏览器的效果有所区别?

    可视区不是调用外面浏览器,Dreamweav 可视化区是为用户编辑而设计. 支持最基本的 HTML 与 CSS ,对 CSS 而言,我写入样式时如果你使用最基本的样式时它显示与你浏览器中看的效果相差不 ...

  3. C# System.Timers.Timer中的坑,程序异常退出后timer依然运行问题

    问题背景 C#小白,由于本公司IM系统服务端(java)是本人独立开发的,加上现在所在项目需要对接IM系统,于是IM的客户端(C#实现)对接工作就交给我了.于是C#小白的我天真的以为只要调用C#端的S ...

  4. go编程资料库

    1.Go语言圣经(中文版)           https://books.studygolang.com/gopl-zh/

  5. mkdir、touch、rm和rmdir命令

    一.mkdir命令 mkdir命令用来创建目录.该命令创建由dirname命名的目录.如果在目录名的前面没有加任何路径名,则在当前目录下创建由dirname指定的目录:如果给出了一个已经存在的路径,将 ...

  6. python系列之(5)PyMySQL的使用

    简介 PyMySQL是在 Python3.x 版本中用于连接 MySQL 服务器的一个库,Python2中是使用mysqldb. 安装 pip3 install pymysql 创建连接 #!/usr ...

  7. 未能加载文件或程序集 XXX 或它的一个依赖项。参数错误

    引发原因 :电脑突然蓝屏重启 解决方法:删除 C:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET Files 下的所有文件 ...

  8. Python中的TCP三次握手和四次挥手过程

    tcp三次握手和四次挥手 首先先介绍什么是传输层: 1.三次握手 1) 三次握手的详述 首先Client(客户)端发送连接请求报文,Server(服务器)段接受连接后回复ACK报文,并为这次连接分配资 ...

  9. 2017 ACM-ICPC 亚洲区(西安赛区)网络赛: B. Coin 【概率题】【数论】

    Bob has a not even coin(就是一个不均匀的硬币,朝上的概率不一定是1/2), every time he tosses the coin, the probability tha ...

  10. 一维数组的求平均成绩 Day06

    package com.sxt.arraytest1; /* * 求班里学生的平均成绩,以及成绩的综合 输出每个同学的成绩 */ import java.util.Arrays; import jav ...