用CSS让文字居于div的底部
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的底部的更多相关文章
- CSS实现文字竖排 DIV CSS文字垂直竖列排版显示如何实现?
DIV CSS实现文字竖排排版显示兼容各大浏览器,让文字垂直竖列排版布局. 有时我们需要一段文字进行从上到下竖列排版,我们知道CSS样式中有一样式可以让其竖列排版,但所有浏览器不全兼容,逼不得已放弃. ...
- [html][css]让文字在div中居中的方法[转]
转至:http://dreamweaver.abang.com/od/divcss/a/vertical-align.htm 一.行高(line-height)法 如果要垂直居中的只有一行或几个文字, ...
- 文字在div中水平和垂直居中的的css样式
文字在div中水平和垂直居中的的css样式 text-align:center; /*水平居中*/ line-height: 20px; /*行距设为与div高度一致*/ 示例如下: HTML元素 & ...
- div介绍 盒子模型边框属性 CSS初始化 文字排版 边框调整 溢出
今天学习的div,了解了div是干什么用的掌握了什么是盒子模型,以及div的外边距内边距以及边框,运用div和CSS给文字排版,利用边框的来做图像,div溢出的处理 CSS初始化: 精确排版的时候用这 ...
- 文字添加响应事件,js动态加载CSS, js弹出DIV
文字添加响应事件,js动态加载CSS, js弹出DIV <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...
- Css文字在div中自动换行
Css文字在div中自动换行 word-break:break-all; 文字在div中字段换行
- CSS div水平垂直居中和div置于底部
一.水平居中 .hor_center { margin: 0 auto; } 二.水平垂直居中 .content { width: 360px; height: 240px; } .ver_hor_c ...
- css 如何使图片与文字在div中居中展示?
1.情景展示 如何将图片与文字在div中一起居中展示? HTML片段 <div style="background: #fff;padding-top: 5px;border:1p ...
- [转]div内容底部对齐
本文转自:http://blog.csdn.net/hellomy/article/details/5889833 <html> <head> <meta http-eq ...
随机推荐
- JQuery 多选按钮checkbox
JQuery 多选按钮checkbox 在需要全选和选择部分的时候我们就需要多选在这里主要介绍了具体的实现 JQuery $(function () { //全选或全不选 $("#allbo ...
- 转:应用JMeter测试solr请求
使用JMeter测试solr请求 一.安装JMeter 在官网http://jmeter.apache.org/download_jmeter.cgi下载JMeter 直接解压JMeter安装包 Li ...
- Screen tearing
Umm, screen tearing happens when the frame rate and the monitor refresh rate don't match. When that ...
- 48、tensorflow入门二,线性模型的拟合
import tensorflow as tf import numpy as np#生成2维的100个0-1的随机数 x_data = np.float32(np.random.rand(2,100 ...
- 错误记录-spring+mybatis
1.Syntax error on token "String", @ expected 解决:去掉类名后的括号 ps:这错误太二了 2.The nested type UserS ...
- phpstudy vhost 配置
server { listen 80 ; server_name user.fudaobank.com; index index.html index.htm index.php; root /ali ...
- 状态转移的最短路 隐式图搜索 UVA 658
紫书365 题目大意:给你n个全都是bug的东西,然后每次可以修复,给你修复前后的状态,问最后如果能把bug全都修复,最少需要多少时间. 思路:从最初状态开始,然后枚举bug即可. 表示priorit ...
- inno setup 1
1.简单脚本 [setup] AppName=Test AppVerName=Test DefaultDirName="d:\setup\app" AppVersion=1.0 ...
- Snackbar使用及其注意事项(转)
http://blog.csdn.net/jywangkeep_/article/details/46405301 Snackbar使用及其注意事项 引言 Snackbar是Android Suppo ...
- nginx+php-fpm 的配置下,php的错误日志
发现php 运行错误时,浏览器的网页上并没有输出php的错误日志.那php的错误日志在哪里呢? 发现在 /var/log/nginx/error.log文件中. 怎么样才能在浏览器的网页中输出php的 ...