标签: text-align
文本右对齐和右填充
我到处都看到这个帖子，没有真正的帮助，或者它被无缘无故地关闭，除了版主觉得它在未来“没有帮助”，尽管谷歌得出了一个很好的结果，总结了大约 55,000 多个相关结果。
那么，为什么 padding-right 不能与父级一起使用，而文本对齐右子级呢？
.rightcbar {
display: block;
font-family: 'Roboto', sans-serif;
text-shadow: 0px 0px 20px #dbd69d;
padding-right: 50px;
height: 152px;
width: 592px;
line-height: 152px;
background: url(rightcbar.png) no-repeat;
}
.rightcbar .rightctext {
display: inline-block;
width: 100%;
text-align: right;
font-size: 25px;
color: #f3f1de;
font-size: 25px;
font-family: 'Roboto', sans-serif;
text-shadow: 0px 0px 10px #aaa;
-webkit-font-smoothing: subpixel-antialiased;
}
超文本标记语言
<div id="rightc">
<div class="rightcbar">
<div class="rightctext">Test</div>
</div>
<div class="rightcbar">
<div class="rightctext">Test</div>
</div>
<div class="rightcbar">
<div class="rightctext">Test</div>
</div>
</div>
Smeegs 帮助准确解释了为什么事情没有按照我下面的意图进行；如果你感兴趣。这是修改后的工作代码。
.rightcbar {
display: …推荐指数
解决办法
查看次数
在 HTML 中，可以缩小段落以使句子具有相同的宽度吗？
我想显示一个像这样的短文本对齐中心句子。
<p style="font-size: 13px; text-align: center; width: 600px;">
This is a variable-length sentence which is sometimes only a few words and sometimes up to three lines long.
</p>
这是一个可变长度的句子，有时只有几个单词，有时长达三行。
现在发生的情况是，由于宽度的原因，最后两个单词“lines long”落在段落的下一行。在居中对齐中，这看起来相当难看。我当前解决此问题的方法是在正确的位置手动插入中断。
<p style="font-size: 13px; text-align: center; width: 600px;">
This is a variable-length sentence which is sometimes<br/>only a few words and sometimes up to three lines long.
</p>
这是一个可变长度的句子，有时
只有几个单词，有时长达三行。
一直这样做会变得很累。HTML 有没有办法自动执行此操作？那么基本上首先让“p”元素确定显示文本所需的最小行数，然后在保持相同行数的情况下尽可能水平缩小它？
推荐指数
解决办法
查看次数
text-align:在li标签内的span上
我的结构看起来像这样:
<ul class="grupa-playerow">Blabla
<li class="player-li">Layout1<span class="player-godziny">15.00-17.00</span></li>
<li class="player-li">Layout2<span class="player-godziny">17.00-22.00</span></li>
<li class="player-li">Layout3<span class="player-godziny">22.00-24.00</span></li>
</ul>
这里的风格:
.grupa-playerow {
position: relative;
width: 300px;
list-style-type: none;
padding: 7px 0 7px 0;
border-bottom: 1px solid #CDCDCD;
font-size: 11px;
cursor: pointer;
}
.player-li {
padding: 2px 0 2px 20px;
width: 100%;
text-align: left;
}
.player-godziny {
text-align: right !important;
color: #5ACFC9;
}
我希望.player-godziny跨度向右对齐.为什么不工作？
这是一个小提琴:http://jsfiddle.net/wL2SF/
推荐指数
解决办法
查看次数
将WebView中的文本方向设置为RTL
如何在webview中将文本方向更改为从右到左？
这是我的代码
WebView web = (WebView) findViewById(R.id.web);
web.getSettings().setJavaScriptEnabled(true);
web.loadDataWithBaseURL("", myhtml, "text/html", "UTF-8", "");
推荐指数
解决办法
查看次数
如何在字符串之前添加空格
我需要你的帮助,在字符串之前添加空格,因为我需要将String值格式化为页面中的特定位置.例如:
System.out.println(" Hello Word!!");
以上将在String之前给出10个空格,我手工编写它们,但是除了添加手动空格之外还有其他方法来指定String之前的空格吗？
推荐指数
解决办法
查看次数
为什么水平对齐和垂直对齐使用不同的居中术语（居中与居中）？
text-align具有center尽可能的价值并vertical-align具有middle尽可能的价值。
据我所知center，middle并没有不同的含义。那么，为什么同一件事有不同的术语呢？
也许这里有人可以告诉我它的原因。
推荐指数
解决办法
查看次数
text-align:center not working
我试过寻找答案但没有任何效果.我试图对齐一个段落.我很确定没有什么能覆盖CSS中的代码.这是HTML和CSS:
body {
background-image: url("../../images/pic01.jpg");
background-repeat;
}
#main {
background-color: rgb(255, 84, 0);
width: 75%;
margin-left: auto;
margin-right: auto;
margin-bottom: auto;
margin-top: auto;
overflow: auto;
height: 100%;
color: rgb(255, 255, 255);
}
#center {
text-align: center;
}<body id="top">
<div id="main">
<p id="center">
<h1> TEST </h1>
</p>
</div>
</body>这里有什么错误？
推荐指数
解决办法
查看次数
文本溢出：省略号无法与文本对齐一起使用：Chrome/Safari 中的居中？
为什么text-overflow: ellipsisFirefox 中的水平对齐方式与 Chrome 和 Safari 中的不同？
以下是一些显示我所指内容的图像：
我希望它如何显示（Firefox）：
text-overflow: ellipsistext-align: center在 Firefox 中应用：
我不希望它显示的方式（Chrome/Safari）：
text-overflow: ellipsistext-align: center在 Chrome/Safari 中应用：
似乎在 Chrome 和 Safari 中，文本对齐应用于文本，忽略省略号；而在 Firefox 中，它会环绕所有文本，包括省略号。
以下是我在 CSS 中为上面显示的 div 元素编写的内容：
.textblock {
text-align: center;
font-weight: normal;
display: block;
position: absolute;
width: 100%;
line-height: 1em;
padding: 1em;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow-x: hidden;
white-space: nowrap;
}
推荐指数
解决办法
查看次数
为什么这个全局定义的 CSS 规则会影响 Shadow DOM 内部的样式？
我创建了一个具有阴影模式“打开”的 Web 组件，其使用方式如下：
<scu-switch checked="true" value="switch1">
<span id="scu-switch-label">Switch On</span>
</scu-switch>
看起来像这样：
然后我使用以下全局 CSS 将按钮添加到网页：
<scu-switch checked="true" value="switch1">
<span id="scu-switch-label">Switch On</span>
</scu-switch>
现在按钮样式已损坏：
当我检查按钮时，我可以看到，全局样式已应用于影子根
内部的范围（并注意它不是插槽内容的一部分）。
Shadow DOM 应该将样式与网页的其余部分隔离。text-align: center尽管它是在 Shadow DOM 之外定义的，为什么在这里应用它？
推荐指数
解决办法
查看次数
文本对齐：向左并开始以从左到右的方向表现不同
给定以下包含表格的 HTML 文档：
<!DOCTYPE html>
<html dir="ltr">
<head>
<style>
body {
/* text-align: left; */
}
th, td {
border: 1px solid black;
width: 200px;
}
</style>
</head>
<body>
<table>
<tr>
<th>Row 1 Column 1</th>
<th>Row 1 Column 2</th>
</tr>
<tr>
<td>Row 2 Column 1</td>
<td>Row 2 Column 2</td>
</tr>
</table>
</body>
</html>
这将显示一个 2x2 的表格，其中第一行的内容居中，第二行的内容左对齐。这是由于用户代理样式表在 chrome 上设置了text-align: -internal-center;元素th，并且没有为td-elements 设置对齐方式，因此这些样式表使用默认的左对齐方式。
如果我们取消上面代码片段中元素text-align: left;样式的注释，则 -elements 将从 -element 继承此样式，并且表格的所有内容都将左对齐。bodythbody
但是，如果我们将其更改为text-align: start; …
推荐指数
解决办法
查看次数