4当前位置:网页制作CSS教程-CSS实现文字底部对齐
4网页制作分类
CSS | HTML
FrontPage | DreamWeaver
JavaScript | ASP
.Net | PHP
JSP | XML
数据库 | PhotoShop
FireWorks | Flash
4本站推荐内容
4最新网页制作
·IE6/7下absolute/re…
·二行代码解决全部网…
·一行代码解决iframe…
·CSS自动限制文本显…
·CSS属性全解析
·很流行的图片分割显…
·常用CSS命名规范
·绿色系网页配色应用…
·CSS使网页背景图片…
·几种常用的新闻列表…
4热门网页制作
·使网页变灰的代码(…
·应用CSS美化网页
·CSS实现文字底部对齐
·一款DIV+CSS制作的…
·CSS隐藏表格超出的…
·CSS使网页背景图片…
·用CSS改变鼠标箭头
·表格边框CSS语法大全
·CSS制作文本或图片…
·几种常用的新闻列表…
4相关网页制作
·应用CSS美化网页
·DIV+CSS制作个性导…
·CSS使网页背景图片…
·层叠样式表(CSS)…
·CSS去除表格默认间…
·初学CSS容易出现的…
·中文排版的CSS设计…
·DIV&CSS布局入门
·层叠样式表(CSS)…
·层叠样式表(CSS)…
CSS实现文字底部对齐
类别:CSS教程    来源:网络    时间:2008-4-18    贴士:推荐给好友
收藏本页 8 
css对文字的布局上没有靠容器底部对齐的参数,不过我们可以使用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>CSS实现文字底部对齐</title> 
<style type="text/css"> 
#txt{
 height:300px; 
 width:300px; 
 border:1px solid #333333; 
 position:relative  


#txt p{ 
 position:absolute; 
 bottom:0px; 
 padding:0px; 
 margin:0px 

</style> 
</head>  
<body> 
<div id="txt"> 
<p><a href="http://www.zzsky.cn" target="_blank">中国站长天空</a></p> 
</div> 
</body> 
</html>
·上一篇:CSS控制图片自动适应大小
·下一篇:CSS十个注意事项
本站部分内容收集整理于网络,仅用于学习,不存在商业目的,如有涉及版权等问题请联系站长,本站将在第一时间内进行处理!
Copyright © 2007-2008 Zzsky.Cn  中国站长天空  网站制作维护:可乐猫  QQ:8127544(请注明来意)
设为首页  加入收藏  联系站长  友情链接  闽ICP备08002933号