html – 将书写模式文字方向设置为自下而上

概述我找不到一个解决方案,让绿色元素从容器的右下角开始,就像右图(“需要”)一样. CSS是否提供了一种从底部对齐/定向元素的方法？ 图示了“默认”和“需要”元素的位置. SNIPPET .cnt { width:200px; height:300px; border:1px solid green; text-align:center; display: table-cell; 我找不到一个解决方案,让绿色元素从容器的右下角开始,就像右图(“需要”)一样.

CSS是否提供了一种从底部对齐/定向元素的方法？

图示了“默认”和“需要”元素的位置.

SNIPPET

.cnt {  wIDth:200px;  height:300px;  border:1px solID green;  text-align:center;  display: table-cell;  vertical-align: bottom;}.itm {  transform: translate(0px,0px) scale(1);  display: inline-block;  padding:10px;  wIDth:20px;  margin:10px;  background: green;  color: white;  Transition:transform 0.5s;}.itm:hover {  transform: translate(0px,-3px) scale(1.1);}@H_419_11@  
<div >  <div >1</div>  <div >2</div>  <div >3</div>  <div >4</div>  <div >5</div>  <div >6</div>  <div >7</div>  <div >8</div></div>@H_419_11@解决方法 
   
Does CSS provIDe a way to align/orIEnt elements from the bottom?
  
  
令人惊讶的是,在水平书写模式下,它并没有出现.
  
有各种属性,包括书写模式,方向,文本方向和d性方向,允许您重新排列内容流.
  
但是它们似乎都没有允许从右下角开始以水平书写模式布置内容.也许有人可以纠正我.
  
同时,这是一个黑客(纯CSS)：
    
.cnt {  display: flex;  flex-direction: row-reverse;  flex-wrap: wrap;  align-items: flex-start;  align-content: flex-start;  justify-content: center;  text-align: center;  wIDth: 200px;  height: 300px;  border: 1px solID green;  transform: scaleY(-1);}.itm {  padding: 10px;  wIDth: 20px;  margin: 10px;  background: green;  color: white;  transform: translate(0px,0px) scaleY(-1) scaleX(1);  Transition: transform 0.5s;}.itm:hover {  transform: translate(0px,-3px) scaleY(-1.1) scaleX(1.1);}@H_419_11@  
<div >  <div >8</div>  <div >7</div>  <div >6</div>  <div >5</div>  <div >4</div>  <div >3</div>  <div >2</div>  <div >1</div></div>@H_419_11@  
https://jsfiddle.net/o7hr07k6/
                  总结       
以上是内存溢出为你收集整理的html – 将书写模式/文字方向设置为自下而上全部内容，希望文章能够帮你解决html – 将书写模式/文字方向设置为自下而上所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
					
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: https://outofmemory.cn/web/1139026.html