JSFiddle - React, Tailwind, and code Playground

HTML

<br />

<ul>
    <li>
        <a href="#home">ل</a>
        <a href="#page1">لبالأولى</a>
        <a href="#page2">الصفحة لبلالثانية</a>
        <a href="#page3">الصفحة البلبللثالثة</a>
    </li>
</ul>


<div id="home">
    مرحبا في الصفحة الرئيسية
</div>

<div id="page1">
    مرحبا في الصفحة الأولى
</div>

<div id="page2">
    مرحبا في الصفحة الثانية
</div>
    
<div id="page3">
    مرحبا في الصفحة الثالثة
</div>

CSS

body{
    direction:rtl;
    margin:1em;
    
}
a{
    margin:1em;
    padding:1em;
    border:2px solid #F00;
}
div{
    display:none;
    margin:2em;
    padding:9px;
    text-align:center;
    border:2px solid #F00;
}

/* 
    هنا كود إظهار العناصر
    إذا كان الديف target
    يكون ستايله
*/
div:target{
    display:block;
}