CSS:左对齐标签,右对齐(CSS : Align label left, text right)

我有这样的文字:

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

我希望它是:

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

我怎么能用CSS做到这一点?

编辑:添加代码,虽然我发现它没用

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

I have a text like this :

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

I want it to be :

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

How can I do this with CSS ?

Edit : Add code, although I find it useless

AAA : aaaaaaaaaaaaaaaaaa

B : bbbbb

CCCCC : cccccccc

原文:https://stackoverflow.com/questions/32347394

2019-06-03 00:21

满意答案

您需要添加一些包含文本内部元素的元素,然后您可以在包装器上使用样式来设置文本的width 。 我用过span 。

div span:first-child {

float: left;

width: 10%;

}

AAA: aaaaaaaaaaaaaaaaaa
B: bbbbb
CCCCC: cccccccc

You've to add some element that wraps the text inside it and then you can use styles on the wrapper to set the width of the text. I've used span.

div span:first-child {

float: left;

width: 10%;

}

AAA: aaaaaaaaaaaaaaaaaa
B: bbbbb
CCCCC: cccccccc

2015-09-02

相关问答

您需要添加一些包含文本内部元素的元素,然后您可以在包装器上使用样式来设置文本的width 。 我用过span 。 div span:first-child {

float: left;

width: 10%;

}

AAA: aaaaaaaaaaaaaaaaaa
B: bbbbb
<...>

如果select元素是最高的东西,为什么不漂浮标签? 你也可以借此机会将它变成一个标签,而不是一个div文本。 这里是CSS: #category-select {

left: 0px;

top: 0px;

width: 350px;

border: 1px solid #666;

text-align: right;

}

#category-select label {

float: left;

margin: 1px;

}

这里是HTM...

这与你从一开始就有点分歧,但过去我一直这样做: CSS: .details {

clear: both;

padding: 7px 15px;

margin: 20px 15px 15px 15px;

background: #111111;

text-align: right;

}

.toplink {

float: left;

}

HTML:

To Top

...

您可以通过display:flex实现它 - 无需更改标记 .button-wrap {

display: flex;

}

.button:nth-child(2) {

/* margin left the second button */

margin-left: auto;

}

First Button

Second Butt...

添加display: flex; align-items: center; display: flex; align-items: center; to .selectLabel将解决这个问题 .select{

width:100%;

padding-left: 2%;

text-align: left;

margin: 10px auto 10px;

position: relative;

}

#select{

border: 1px sol...

而不是对您的代码进行大规模更改。 只需给div设置background-color属性并清除浮动元素clear:both; 休息或任何元素,使其识别元素。 这是一个有效的JSFiddle: http : //jsfiddle.net/fLj5qvc7/ HTML

A

B

CSS...

这可能是你需要的: label, input {vertical-align: baseline;}

具有相同属性的两个元素都会有所帮助。 基线也类似。 中间工程在IE7中有所不同。 希望能帮助到你! This could be what you needed: label, input {vertical-align: baseline;}

Both element with the same property, will help. Also baseline works similar....

我不知道关于android的一切,但我仍然认为这不可能你问的原因你想在1个单一的EditText设置Gravity,不同的单词( 左边的名字和右边的文字 )不同 我想得到相同的结果是, 1)让您的设计师为您制作一个屏幕宽度和所需高度的白色圆角矩形,以及另一个带橙色边框的相同图像(如您在选择任何编辑文本时所看到的那样) 2)现在,在xml文件中取一个 ,将第一个图像设置为此布局的背景,并在该布局中Take 1 TextView(for Name:) and EditTex...

一切看起来都与我保持一致。 你偶然意味着你想要一条线上的所有东西吗? .name{

font-weight: bold;

text-align: left;

float: left;

}

.value{

text-align:left;

float:left;

}

jsfiddle在这里 根据您对问题的编辑....唯一的方法是获得.name类的宽度。 如果没有设定的宽度,.value将立即落在.name的左侧并垂直放置,它们将不会对齐到左侧。 .name{

font-weight: bold;...

您需要将text-align: left样式添加到.control-label 。 因为bootstrap使用选择器.form-horizontal .control-label在水平表单中提供文本对齐样式,所以您需要使用相同或更具体的选择器: .form-horizontal .control-label{

text-align: left;

}

的jsfiddle You need to add a text-align: left style to .control-label. ...

相关文章

<table > <tr > <td ><input t

...

Text fields are typically indexed by breaking the t

...

一、中文分词:分词就是利用计算机识别出文本中词汇的过程。 1.典型应用:汉字处理:拼音输入法、手写识别

...

mysql 左对齐_CSS:左对齐标签,右对齐(CSS : Align label left, text right)相关推荐

  1. css设定元素左对齐,左对齐标签 - 右对齐选择元素(CSS)

    我有一个表单布局,我想显示左对齐的标签和右对齐的表单控件.我一直试图让它在表单控件上使用float:right(在这种情况下为a),然后将clearfix类应用于它,但clearfix似乎不在我的选择 ...

  2. html中调整lable位置右移,[转载]label标签右对齐

    label标签右对齐 我们经常需要以下效果,如图: 实现的代码: /p> Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD ...

  3. 如何让DIV中的内容左边的靠左对齐,右边的靠右对齐?

    在一行里面 <div> <div style="float:left">sdafadsf</div> <div style="f ...

  4. echars 柱状图靠左_echart 柱状图如何让y轴文字靠左显示,series上文字右对齐显示...

    option = { title: { text: '世界人口总量', subtext: '数据来自网络' }, tooltip: { trigger: 'axis', axisPointer: { ...

  5. java jlabel 对齐_java-将JLabel中的文本右对齐

    这可以通过两种方式完成. JLabel水平对齐 您可以使用BoxLayout构造函数: JLabel(String text, int horizontalAlignment) 要向右对齐: JLab ...

  6. python右对齐输出如果结果超过30个字符_Python3 输出字符串左对齐、右对齐、居中对齐...

    1.通过ljust(),center(),rjust()函数实现输出的字符串左对齐.居中.右对齐 方法一:使用函数默认不带参数,则默认以空格填充(文字与空格总字符数等于输入的数字) #代码 print ...

  7. html中把句子往右边弄一点咋办,CSS上的左,中,右对齐方法,可以在一行上混合...

    一种用CSS以左对齐/中心对齐/右对齐方式显示用HTML编写的句子的方法 在用"从左到右书写的语言"(如日语和英语)中编写的HTML中,除非指定了字符移位方向,否则句子左对齐显示. ...

  8. CSDN Markdown 文本居中、右对齐、左对齐

    语法 <center>居中</center> <p align="right">右对齐</p> <p align=" ...

  9. python第一行左对齐_python 左对齐,右对齐

    python 左对齐,右对齐 >>> print('{} and {}'.format('hello','world')) # 默认左对齐 hello and world >& ...

最新文章

  1. linux /etc/fstab 挂载列表 简介
  2. python基础教程:数值与字符串类型
  3. 打包 压缩 命令tar zip
  4. Django之序列化
  5. mysql set语句_mysql--乱码解决(6)
  6. integer比较_Java中的整型包装类值的比较为什么不能用==比较?原因是因为缓存
  7. python 云词库
  8. 在Zabbix中添加交换机端口监控
  9. Gstreamer之No package ‘gstreamer-1.0‘ found解决(十一)
  10. 有关STL使用上的一些注意事项。关于某些函数的参数问题。
  11. Codevs 均分纸牌(贪心)
  12. Hbase下载与安装部署(一)- 独立式
  13. SUBMAIL API如何帮助您构建企业云通信平台?
  14. 生成和获取法定节假日
  15. Vue组件传值、Vue、组件
  16. unity之摇杆和NPC
  17. Centos7 GNOME Desktop桌面版-调整屏幕分辨率
  18. linux 下strip工具,linux下使用strip如何对库和可执行文件进行裁减
  19. C2977 “boost::type_of::encode_type”: 模板 参数太多
  20. 聊聊gorm的OnConflict

热门文章

  1. iBatis 的简单入门
  2. 胡戈的“鸟笼山剿匪记”与馒头
  3. 阿里云 linux服务器环境搭建学习 安装jdk(一)
  4. 一步步学习电子维修汇总贴
  5. Cartopy调用天地图API,在服务器端实现。并解决调用出现的:418问题
  6. 用python构建多只股票日收益率直方图_5种方法教你用Python玩转histogram直方图
  7. 又一行业遭遇滑铁卢 “AI算命”能取代算命大师么
  8. Radius+无线控制器+深信服行为管理 部署无线802.1X认证
  9. 触控显示展|2023(深圳)国际触控与显示技术展览会
  10. bugku 新平台 web1 writeup