代码如下

<style type="text/css">

.box1 {border:1px #cccccc solid;  width:500px; height:600px;position:relative;}

.box2 {border-top:1px #cccccc solid; background:#f2f6fb; width:498px; height:22px; position:absolute; bottom:1;background-color:red;}

</style>

<div class="box1">

    <div class="box2"></div>

</div>

DIV相对于父DIV底部对齐的实现方法的更多相关文章

  1. 让div盒子相对父盒子垂直居中的几种方法

    div相对于父盒子垂直居中的几种方法,之前在网上看到很多种方法,确实说的很对,也很具体,但是我感觉对于初学者来说,一目了然是最重要的,所以,我把很高深的技巧,和很复杂的css样式都剔除掉,旨在让更多人 ...

  2. CSS布局之div交叉排布与底部对齐--flex实现

    最近在用wordpress写页面时,设计师给出了一种网页排布图样,之前从未遇到过,其在电脑上(分辨率大于768px)的效果图如下: 而在手机(分辨率小于等于768px)上要求这样排列: 我想到了两种方 ...

  3. Position a child div relative to parent container in CSS: [设置 子DIV位置 跟 父DIV相关联]

    最近调DIV的位置比较头疼,各种position: relative / absolute google到一篇好文章[http://www.webdevdoor.com/html-css/css-po ...

  4. css 父div如何包裹带有float属性的子div,float子div如何撑开父div

    来自网络摘抄 原始代码 <style> #div1{border:1px solid red;float:left;} #div2,#div3{float:right;border:1px ...

  5. 子div设置float后会导致父div无法自动撑开

    本文是从简书复制的, markdown语法可能有些出入, 想看"正版"和更多内容请关注 简书: 小贤笔记 注: 文章部分转载 彩泉 - 博客园 原因:内部的DIV因为float:l ...

  6. 子div设置margin-top使得父div也跟着向下移动

    之前在写网页的时候,发现一个小问题,就是子div设置margin-top的时候,父的div也会跟着向下移动.我用代码和图描述一下问题: <span style="font-size:1 ...

  7. CSS多种方式实现底部对齐

    CSS实现底部对齐效果 因公司业务要求需要实现如下图中红色区域的效果: 效果说明: 1.红色区域数据需要倒排(即从底部开始数,数字为1.2.3.4.5),并且显示在最底部 2.当数据过多时需要显示滚动 ...

  8. Vue父组件向子组件传递方法(自定义方法)并且子组件向父组件传递数据

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. Vue 父组件往子组件传递方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 【Combination Sum 】cpp

    题目: Given a set of candidate numbers (C) and a target number (T), find all unique combinations in C  ...

  2. 聊聊、RabbitMQ 配置文件

    windows 下面安装 rabbitMQ 比较简单,但是想去改端口相关信息却找不到配置文件在哪.Linux 在 /etc/rabbitmq/rabbitmq.config 下面就可以找到.来看看 w ...

  3. c++11特性使用

    #include <list> #include <iostream> int main(){ list<int> lst; for(list<int> ...

  4. Mysql,phpmyadmin密码忘了怎么办

    1.关闭mysql服务 # service mysql stop 如果提示mysql: unrecognized service这样的错误提示. 先查看查找mysql.server,使用:find / ...

  5. PHP排序的几种方法

    // 冒泡排序 function BubbleSort($arr) { // 获得数组总长度 $num = count($arr); // 正向遍历数组 for ($i = 1; $i < $n ...

  6. aplusb 数论

    题目描述 SillyHook 要给小朋友出题了,他想,对于初学者,第一题肯定是a+b啊, 但当他出完数据后神奇地发现.in 不见了,只留下了一些.out,他想还原.in,但 情况实在太多了,于是他想要 ...

  7. include和require的区别误区

    面试时总会被问到include和require的区别,回答的时候一般也是有以下几种区别: 1.include引入文件的时候,如果碰到错误,会给出警告,并继续运行下边的代码. require引入文件的时 ...

  8. Java代码添加背景音乐

    太心塞!弄了很久才终于把Java添加背景音乐实现了.不过还是很Happy! 这次介绍的办法,是只要一打开Java Application,便可直接听到背景音乐.代码保存,方便以后再次利用. packa ...

  9. Linux服务器重启后nvidia-smi无法使用的解决方法

    服务器上的nvidia显卡驱动用的好好的,突然有一天,服务器断电了,然后恢复之后发现常用的nvidia-smi命令无法使用了,具体显示什么无法建立和驱动器的通信之类的,上网查了一堆,发现问题的核心:l ...

  10. [AGC004E] Salvage Robots （DP）

    Description 蛤蟆国的领土我们可以抽象为H*W的笼子,在这片蛤土上,有若干个机器人和一个出口,其余都是空地,每次蛤蟆会要求让所有的机器人向某个方向移动一步,当机器人移动到出口时会被蛤蟆活摘出 ...