html - 从左到右到从右到左转换 - 输入
问题描述
我编写了一个输出为 [What is] 1的代码,我希望它是 [What should be] 2我该怎么做?应该在哪里编辑?
我编写了一个输出为 [What is] 1的代码,我希望它是 [What should be] 2我该怎么做?应该在哪里编辑?
.prt-pricing-detial {
display: table;
text-align: right;
width: 100%;
margin-bottom: 25px;
}
.pricing-heading {
font-family: "Mr Eaves XL Modern", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: normal;
line-height: normal;
font-size: 16px;
color: #000000;
vertical-align: middle;
display: table-cell;
}
.pricing-profit {
display: inline-block;
text-align: center;
height: 42px;
font-size: 18px;
width: 120px;
text-indent: 8px;
}
.prt-pricing-name {
text-align:center;
font-weight: 600;
font-size: 18px;
margin-bottom: 20px;
}
<div class="prt-pricing-content">
<div class="prt-pricing-name"><span></span></div>
<div class="prt-pricing-detial">
<span class="pricing-heading">سود شما:</span><div class="pricing-field">
<input class="pricing-profit" type="number" value="25.00" disabled="">
解决方案
使用 CSS direction:rtl
。
.row-reverse {
direction: rtl;
}
Direction
属性指定块级元素内的文本方向/书写方向。
Direction
有一个 4 值
direction: ltr|rtl|initial|inherit;
所以我只给这个问题2
- ltr =文本方向从左到右- 默认
- rtl =文本方向从右到左
会得到这样的输出
.row-reverse {
direction: rtl;
}
.prt-pricing-detial {
display: table;
text-align: right;
width: 100%;
margin-bottom: 25px;
}
.pricing-heading {
font-family: "Mr Eaves XL Modern", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: normal;
line-height: normal;
font-size: 16px;
color: #000000;
vertical-align: middle;
display: table-cell;
}
.pricing-profit {
display: inline-block;
text-align: center;
height: 42px;
font-size: 18px;
width: 120px;
text-indent: 8px;
}
.prt-pricing-name {
text-align: center;
font-weight: 600;
font-size: 18px;
margin-bottom: 20px;
}
<div class="prt-pricing-content row-reverse">
<div class="prt-pricing-name"><span></span></div>
<div class="prt-pricing-detial">
<span class="pricing-heading">سود شما:</span>
<div class="pricing-field">
<input class="pricing-profit" type="number" value="25.00" disabled="">
推荐阅读
- hibernate - 关于 OneToOne 关系的休眠 N+1 问题
- java - Logback 在创建日志文件时无法解析文件名日期模式
- python - 为什么重新定位正在运行的 exe 会使其停止?
- javascript - 垂直添加元素时如何防止背景图像在移动浏览器上缩放?
- ios - YouTube 播放器在某些 videoid 上无法在 iOS 中运行
- android - 如何将图像位图传递给 Tensorflow Mobile 模型?
- javascript - 我需要使用“gridWrapper.innerHTML = gridWrapper.innerHTML+”打印一个表格
- java - Set 作为抽象数据类型和作为接口有什么区别?
- spring - 如何处理 RestTemplate 中的响应代码而不捕获异常?[弹簧靴]
- reactjs - 无法在 React with Apollo 中为 GraphQL 查询找到正确的打字稿接口