css文字的布局上没有靠容器底部对齐的参数,目前使用的一个不错的方法也比较好.就是用position属性来解决,看下面的代码,用position的相对和绝对定位功能也轻松的实现了,文字靠近div低部对齐,并且靠近的距离还可以精确到像素,自己可以调节,是不是很不错呢?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<style type="text/css">
#txt{ height:300px;
width:300px;
border:1px solid #333333;
text-align:center;
position:relative }
#txt p{
position:absolute;
bottom:0px;
padding:0px;
margin:0px
}
</style>
</head> <body>
<div id=txt>
<p>aadsad</p>
</div>
</body>
</html>

  

用CSS让文字居于div的底部的更多相关文章

  1. CSS实现文字竖排 DIV CSS文字垂直竖列排版显示如何实现?

    DIV CSS实现文字竖排排版显示兼容各大浏览器,让文字垂直竖列排版布局. 有时我们需要一段文字进行从上到下竖列排版,我们知道CSS样式中有一样式可以让其竖列排版,但所有浏览器不全兼容,逼不得已放弃. ...

  2. [html][css]让文字在div中居中的方法[转]

    转至:http://dreamweaver.abang.com/od/divcss/a/vertical-align.htm 一.行高(line-height)法 如果要垂直居中的只有一行或几个文字, ...

  3. 文字在div中水平和垂直居中的的css样式

    文字在div中水平和垂直居中的的css样式 text-align:center; /*水平居中*/ line-height: 20px; /*行距设为与div高度一致*/ 示例如下: HTML元素 & ...

  4. div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出

    今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...

  5. 文字添加响应事件,js动态加载CSS, js弹出DIV

    文字添加响应事件,js动态加载CSS, js弹出DIV <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...

  6. Css文字在div中自动换行

    Css文字在div中自动换行 word-break:break-all; 文字在div中字段换行

  7. CSS div水平垂直居中和div置于底部

    一.水平居中 .hor_center { margin: 0 auto; } 二.水平垂直居中 .content { width: 360px; height: 240px; } .ver_hor_c ...

  8. css 如何使图片与文字在div中居中展示?

      1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...

  9. [转]div内容底部对齐

    本文转自:http://blog.csdn.net/hellomy/article/details/5889833 <html> <head> <meta http-eq ...

随机推荐

  1. A. Launch of Collider Codeforces Round #363 (Div2)

    A. Launch of Collider time limit per test 2 seconds memory limit per test 256 megabytes input standa ...

  2. [bzoj3196][Tyvj 1730][二逼平衡树] (线段树套treap)

    Description 您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作: 1.查询k在区间内的排名 2.查询区间内排名为k的值 3.修改某一位值上的数值 4.查询k在 ...

  3. form表单中的带有name的标签直接转JSON

    1. 将如下内容引入页面:比如说新建一个 a.js,然后在页面中引入a.js//将form表单序列化成json格式 $.fn.serializeObject = function () { var o ...

  4. 第十三节,基本数据类型,数字int字符串str

    基本数据类型 数字 int 字符串 str 布尔值 bool 列表 list 元组 tuple 字典 dict 数据类型关系图 查看一个对象的类 如:如查看对象变量a是什么类          用到函 ...

  5. jQuery第二章

    一.jQuery选择器 jQuery的行为规则都必须在获取到元素后才能生效.来看一个简单的例子: <p class = “demo”>jQuery Demo</p> <s ...

  6. Hibernate 关系映射方式(1)

    来源:本文转载自:http://blog.csdn.net/huangaigang6688/article/details/7761310 Hibernate映射解析——七种映射关系 首先我们了解一个 ...

  7. error while loading shared libraries: libmcrypt.so.4

    /usr/local/php/sbin/php-fpm: error while loading shared libraries: libmcrypt.so.4: cannot open share ...

  8. sed用法小结

    简介: sed 是一种在线编辑器,它一次处理一行内容.处理时,把当前处理的行存储在临时缓冲区中,称为“模式空间”(pattern space),接着用sed命令处理缓冲区中的内容,处理完成后,把缓冲区 ...

  9. Object-C 自学笔记 - 1

    1.基本变量类型 类型 标示符 输出格式 整形 int %i 浮点 float %f 双精度 double %g 单字符 char %c 以上是基本类型,除此之外还有long, long long i ...

  10. hover带有动画效果的导航

    html,body{overflow-x:hidden;} ul,li{list-style: none;} .nav{width:100%; height: 26px; overflow: hidd ...