tRikSonic

Tema

Original
Translate

HTML dir Attribute

Terakhir diperbarui : 8 April 2018 - 09.40

HTML dir Attribute - HTML dir Attribute Digunakan untuk menentukan arah teks konten pada sebuah element. Misal kalau penulisan dalam bahasa indonesia, inggris dari kiri ke kanan, dan bahasa arab dari kanan ke kiri

Attribute Value:

Attribute	Value	Deskripsi
dir	ltr rtl auto	left to right menentukan arah teks dari kiri kekanan right to left menentukan arah teks dari kanan ke kiri Membiarkan browser yang menentukan arah.

Contoh penerapan HTML dir Attribute

<p >bismillahirrahmanirrahim</p>
<p lang="ar" dir="rtl"> بِسْــــــــــــــــــمِ اللهِ الرَّحْمَنِ الرَّحِيْمِ </p>

Browser Support:

HTML
Attribute	Chrome	Safari	Firefox	Opera	IE
dir	Ya	Ya	Ya	Ya	Ya

Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.

*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}hr{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;}input[type=checkbox],input[type=radio]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}input[type=search]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}:after,:before{box-sizing:border-box}input[type=search]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;}button.close{-webkit-appearance:none;}input#atur_split{-webkit-appearance: none;}input#atur_split::-webkit-slider-runnable-track {-webkit-appearance: none;}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}.no-radius {border-radius:0px!important;-webkit-border-radius : 0px !important;-moz-border-radius : 0px !important;-o-border-radius : 0px !important;-ms-border-radius : 0px !important;-khtml-border-radius : 0px !important;}.btn-trans .badge {-moz-border-radius: 50px;-webkit-border-radius: 50px;-o-border-radius: 50px;-ms-border-radius: 50px;-khtml-border-radius: 50px;}.box-part{-webkit-border-radius:4px;-moz-border-radius:4px;}.gridmode {-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;-khtml-border-radius: 5px;background: #ffffff;}input#atur_split::-webkit-slider-runnable-track {box-shadow: none;border: none;background: transparent;-webkit-appearance:none;}input#atur_split::-moz-range-track {box-shadow: none;border: none;background: transparent;-webkit-appearance:none;}input#atur_split::-moz-focus-outer {border: 0;}input#atur_split::-webkit-slider-thumb {width: 10px;height: 10px;border: 0;background: #42bdca;border-radius: 100%;box-shadow: 0 0 1px 0px rgba(0,0,0,0.1);-webkit-appearance:none;}input#atur_split::-moz-range-thumb {width: 10px;height: 10px;border: 0;background: #42bdca;border-radius: 100%;box-shadow: 0 0 1px 0px rgba(0,0,0,0.1);-webkit-appearance:none;}.no-select,button,.tse-line-number {user-select:none;-moz-user-select:none;-webkit-user-select:none;-khtml-user-select:none;-ms-user-select:none;-o-user-select:none;}.select-all {user-select:all;-webkit-user-select:all;-moz-user-select:all;-o-user-select:all;-khtml-user-select:all;-ms-user-select:all;}