第一种方法:

<style>
*{margin:0;padding:0;}
.box{width:500px;height:300px;border:1px solid #000;text-align: center;}
p{display:inline-block;text-align: left;}
</style>
<div class="box">
<p>水电费水电费水水电费水水电费水电费水水电费水电费水电费费水电费水电费水水电费水电费水电费费电费水电费费</p>
</div> 第二种方法:
<style>
*{margin:0;padding:0;}
.box{width:500px;height:300px;border:1px solid #000;}
p{display:table;margin:0 auto;}
</style>

css实现一行文字居中,多行文字居左的更多相关文章

  1. css--实现一个文字少时居中,文字换行时居左的样式

    前言 最近群里的小伙伴去面试,遇到这样一个问题,面试官问:"用 css 对一行文字进行布局,当文字不够换行的时候,这行文字要居中显示,当文字出现换行的时候,这行文字要靠左显示.", ...

  2. css样式实现左边的固定宽度和高度的图片或者div跟随右边高度不固定的文字或者div垂直居中(文字高度超过图片,图片跟随文字居中,反之文字跟随图片居中非table实现)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. CSS布局,div居中,文字居中

    .main { width: 100%; margin: 0 auto; .banner { img { width: 100%; } } .article { margin-bottom: 100p ...

  4. easyui中datagrid标题居中内容居左实现方式

    easyui中的datagrid使用起来,确实还是挺轻巧方便,但是其中也有不少的问题,尤其遇到客户的一些特殊的需求时往往实现得不是很好.这个时候就需要我们自己动手来修改easyui的源码了.easyu ...

  5. css实现一行文字居中,多行文字左对齐

    问题及场景: 当内容能一行显示在盒子内时,文字居中对齐. 当内容过多换行后显示在盒子内时,文字左对齐. 其实这种视觉上的需求还是蛮常见的.比如用于弹出提示框,当提示内容比较少时,内容居中显示在弹出框, ...

  6. 【css对齐】块内或者行内图片与文字居中对齐最靠谱的方式!

    块内或者行内图片与文字居中对齐最靠谱的方式! 做图片与文字在一行的按钮时候最常用到,总结了一个靠谱的方法,终于可以完美的对齐下面给个代码 首先是html: <p class="btnU ...

  7. css 一行或多行文字溢出以...的形式隐藏

    一行文字溢出以...形式隐藏 我需要隐藏... css代码如下: white-space:nowrap; text-overflow:ellipsis; overflow:hidden; 多行文字溢出 ...

  8. css文字居中、图片居中、div居中解决方案

    一.文字居中 若文字只有一行 <!--html代码--> <div class="box"> <p class="text"> ...

  9. CSS多行文字垂直居中的两种方法

    之前写过一篇关于:CSS左右居中对齐的文章,里面提到的两种方法其实也可以引申为垂直居中对齐.写这篇文章是因为要兼容IE6.IE7的问题,我们都知道一行文字时可以通过line-height来设置垂直居中 ...

  10. css一div内文字居中

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

随机推荐

  1. nginx访问量统计

    1.根据访问IP统计UV awk '{print $1}'  access.log|sort | uniq -c |wc -l 2.统计访问URL统计PV awk '{print $7}' acces ...

  2. IIS 配置MVC项目路由中以api结尾的接口

    公司的接口,前端框架是MVC,路由里面对接口配置的路径是以api结尾的,结果之间在iis上访问不了,研究了半天成功了,整理下,以免下次再忘. 路由配置RouteConfig routes.MapRou ...

  3. Windows 网络编程

    网络编程 API ,失败返回 -,错误代码 WSASYSNOTREADY 表示基础网络子系统没有准备好网络通行,WSAVERNOTSUPPORTED 表示 Socket 版本不支持,WSAEINPRO ...

  4. javaSE基础07

    javaSE基础07 一.static静态修饰符 用了static修饰的变量就会变成共享的属性,只会初始化一次,在内存中只存在一个,并且每个对象都可以访问,存放在方法区(数据共享区) 1.1 stat ...

  5. _NSInlineData objectForKeyedSubscript:

    最近总是遇到这个错误:reason: '-[_NSInlineData objectForKeyedSubscript:]: unrecognized selector sent to instanc ...

  6. 文件上传大小js判断

    function fileChange(target) { var fileSize = 0; if (isIE && !target.files) { var filePath = ...

  7. nodeJS常用的定时执行任务的插件

    later:https://github.com/bunkat/later star:1765 fork:120 node-schedule  https://github.com/node-sche ...

  8. 创建Hello World程序(part-1)

    写在前面: 2006年,刚上大学,班上有几个计算机文盲,1分钟打二十几个字都困难,很不幸,我就是其中的一个.强烈的自尊心驱使我不停恶补,翻遍了图书馆的计算机文化基础,知耻而后勇...后来,C语言居然考 ...

  9. NGUI之UIRoot——屏幕的自适应分辨率的计算

    //原来写在其他博客上的东西,搬迁 预备知识: 要明确的三个概念: 设计分辨率:在编辑器上开发UI使用的分辨率.我们所有的UI都是在这个分辨率下设计制作的. 显示区域分辨率:设备上所显示的UI区域在编 ...

  10. git与github使用

    Git和Github简单教程 目录: 零.Git是什么 一.Git的主要功能:版本控制 二.概览 三.Git for Windows软件安装 四.本地Git的使用 五.Github与Git的关联 六. ...