يمكن اجراء العديد من التنسيقات على القوائم من خلال css وذلك بجعل القوائم الرأسية تظهر أفقيا
وذلك من خلال css
وذلك من خلال css
<style>
ul{
display: inline
}
</style>
مثال:
<style>
ul li{
display: inline;
}
</style>
</head>
<body>
<h2>office applications</h2>
<ul>
<li>word</li>
<li>excel</li>
<li>power point</li>
<li>access</li>
</ul>
ناتج المثال:
وبمزيد من التنسيقات باستخدام css يمكن جعل القوائم تظهر كما يلى:-
<style>
#list{padding:0;}
#list li{
display: inline;
}
#list a {
background-color:black;
color:white;
padding:10px;
text-decoration: none;
border-radius: 6px 6px 6px 6px;
}
#list a:hover{background-color: #dd0}
</style>
</head>
<body >
<h2>office</h2>
<ul id="list">
<li> <a href="#">word</li></a>
<li> <a href="#">excel</li></a>
<li><a href="#"> access</li></a>
</ul>
فيظهر ناتج المثال:
وعند الوقوف بالماوس على الارتباطات تظهر كما يلى:-
مع أن الموضوع قديم ولكن تستحق يقالك شكرا وجزاك الله خير .
ردحذف