企业动态关于我们联系我们
   建站常识
 域名常识
域名解析问题集锦
域名基础知识概述
域名dns问题集锦
国内域名转入业务问题集锦
 空间常识
虚拟主机产品说明书
FTP上传注意事项
ftp操作常识问题集锦
网站无法上传怎么办?
 邮局常识
什么是电子邮件地址?
企业邮箱与免费邮箱的区别,企业邮箱的优点?
什么是SMTP?
什么是POP3?
 建站常识
企业如何建好网络营销
三种类型企业网站的作用
如何推广B2C独立网店
做网站快速成功的九个步骤
 SEO 知识
什么是SEO?
什么是SPAM?
SEO和SPAM有什么区别?
影响SEO的几点常识

首页技术交流CSS+DIV
CSS实现文字竖排效果(还有兼容火狐firefox的方法)   2012/3/7   返回前页
CSS实现文字竖排效果有两种方法,建议使用模拟方法实现。

  一、使用writing-mode属性

  语法:writing-mode:lr-tb或writing-mode:tb-rl

  参数:
  1、lr-tb:从左向右,从上往下
  2、tb-rl:从上往下,从右向左

  代码:
div{width:100px;height:80px;writing-mode:tb-rl;}

 

运行代码发现,IE显示正常,火狐却不行,所以不建议使用writing-mode属性,下面使用模拟方法实现。

  二、模拟文字竖排

  代码:

ul{width:100px;height:80px;overflow:hidden;list-style:none;}
ul li{float:right;display:inline;margin-left:4px;width:14px;height:100px;font-size:14px;word-wrap:break-word;word-break:nomal;}


  此方法让li右浮动,设置li宽度和字宽度一样都是14px,这样就自动换行了。另外,“word-wrap:break-word;word-break:nomal;”这句实现标点自动换行(连续字符自动换行)。

本站搜索关键词:南京网站建设、南京建站、南京SEO推广、南京网络公司
   广告也精彩
版权所有:南京欧万网络服务工作室 www.owon.cn sitemap