因此，我预先定义了HTML，在那里我对齐的右边，中间或左边的文本。 当文本中只有几个单词时，它可以像下面的例子那样完美地工作:
null
<!DOCTYPE html>
<html>
<head>
<style>@font-face {
font-family: MyFont;
src: url("file:///android_asset/printer/fonts/DroidSansMono.ttf")
}
<style>
div{
}
span{
word-wrap:break-word;
white-space: normal;
} .normal{ font-weight: normal;
}
.right{
text-align:right;
float:right;
}
.left{
text-align:left;
float:left;
}
.container{
background:red;
letter-spacing:-2.3px;
width: 372px;
font-family: MyFont;
font-size:19px;}
.center{
text-align:center;
margin:auto;
display:table;
}
</style>
</head>
<body>
<div class = container>
<span class="right">TEXT ALIGN RIGHT </span><br>
</div>
</body>
</html>null
但是当文本更大的时候，我不知道为什么它开始向左移动，当自然的时候，它应该只是继续到最后一行，换行继续到下一行。
下面是它应该换行的地方:
null
<!DOCTYPE html>
<html>
<head>
<style>@font-face {
font-family: MyFont;
src: url("file:///android_asset/printer/fonts/DroidSansMono.ttf")
}
<style>
div{
}
span{
word-wrap:break-word;
white-space: normal;
} .normal{ font-weight: normal;
}
.right{
text-align:right;
float:right;
}
.left{
text-align:left;
float:left;
}
.container{
background:red;
letter-spacing:-2.3px;
width: 372px;
font-family: MyFont;
font-size:19px;}
.center{
text-align:center;
margin:auto;
display:table;
}
</style>
</head>
<body>
<div class = container>
<span class="right">TEXT ALIGN RIGHT TEXT ALIGN RIGHT TEXT ALIGN RIGHT </span><br>
</div>
</body>
</html>null
它不能自动换行，因为你告诉它在单词之间中断，而你只有一个“单词”。
您在实际单词之间使用了非中断空格，而不是普通空格。
因为它不能工作换行，所以只有一行。 因为它是右对齐的，所以它从元素的左边伸出。
将宽度:100%添加到css中的跨度
