-1-
-2-
ما هي تقنية CSS؟
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
If the
margin property has four values:- margin: 25px 50px 75px 100px;
- top margin is 25px
- right margin is 50px
- bottom margin is 75px
- left margin is 100px
===============================================
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: 25px 50px 75px 100px;
border: 1px solid black;
background-color: lightblue;
padding-top: 50px;
padding-right: 30px;
padding-bottom: 50px;
padding-left: 80px;
}
</style>
</head>
<body>
<h2>Using individual padding properties</h2>
<div>This div element has a top padding of 50px, a right padding of 30px, a bottom padding of 50px, and a left padding of 80px.</div>
</body>
</html>
=============================================
مثال
<!DOCTYPE html>
<head>
<style>
html {
direction: rtl;
unicode-bidi: isolate;
-webkit-locale: "ar";
}
#LinkList1 {
float: right;
font color : red;
max-width:65%;
padding: 2px 0;
;
position: relative;
vertical-align: top;
border-style: solid;
border-color: red;
}
#LinkList1 ul {
border-radius: 19px;
background-color: #e6e7e8;
/* border-block-start-color: inherit; */
/* border-block-end-style: inherit; */
margin: 5px 7px 5px 5px;
}
#LinkList1 li {
display: inline-block;
vertical-align: top;
}
#LinkList1 li a {
color: #2f3c80;
font-size: 17px;
font-family: Segoe UI, Tahoma;
position: relative;
margin: 10px 10px 0;
border-radius: 50px;
}
#LinkList1 li a:hover {
background-color: #2016da;
color: #f7f1f1;
}
#LinkList1 h2 {
display: none;
}
</style>
<meta charset="utf-8">
</head>
<body >
<div class="widget LinkList" data-version="1" id="LinkList1">
<ul>
<li><a href="http://">الصفحة الرئيسية</a></li>
<li><a href="http://">خدماتى </a></li>
<li><a href="http://">مرحبا</a></li>
<li><a href="http://">اتصل بنا</a></li>
<li><a href="http://">من نحن</a></li>
</ul>
</div>
</body>
</html>
-3-
-4-