我需要在垂直時間線下面顯示新聞,下面的例子非常適合我正在尋找的東西我可以進一步修改我的要求,但我需要相同的英語和&阿拉伯語.英文版本：

https://codepen.io/jplhomer/pen/lgfus

@import "compass/css3";

$gray: #dddddd;

h1, h2, h3 {

font-weight: 300;

}

.container {

padding: 1em;

}

.timeline {

position: relative;

overflow: auto;

&:before {

content: '';

position: absolute;

height: 100%;

width: 5px;

background: $gray;

right: 0;

}

h2 {

background: $gray;

max-width: 6em;

margin: 0 auto 1em;

padding: 0.5em;

text-align: center;

position: relative;

clear: both;

}

ul {

list-style: none;

padding: 0 1em 0 0 ;

z-index: 1;

}

li {

background: $gray;

padding: 1em;

margin-bottom: 1em;

position: relative;

direction:rtl;

text-align:right;

&:before {

content: '';

width: 0;

height: 0;

border-top: 1em solid $gray;

border-right: 1em solid transparent;

position: absolute;

right: -1em;

top: 0;

}

}

h3 {

margin-top: 0;

}

time {

font-style: italic;

}

}

@media screen and (min-width: 40em) {

.container {

max-width: 1000px;

margin: 0 auto;

}

.timeline {

&:before {

left: 50%;

}

ul {

padding-left: 20px;

max-width: 700px;

margin: 0 auto;

}

li {

width: 42%;

}

li:nth-child(even) {

float: left;

margin-top: 2em;

}

li:nth-child(odd) {

float: right;

&:before {

border-top: 1em solid $gray;

border-right: 1em solid transparent;

left: auto;

right: -1em;

}

}

li:nth-of-type(2n+1) {

clear: both;

}

}

}

我修改了CSS以使用RTL語言但是第一元素ul的指針顯示右側的箭頭,我試圖在左側顯示箭頭.我嘗試過一些東西,但是其中一個或另一個東西打破了

總結

以上是生活随笔為你收集整理的html语言对齐是什么意思,html – 对齐RTL语言的元素的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。