بسم الله والحمد لله
السلام عليكم ورحمة الله وبركاته ,, كيف حالكم إخواني ..
اليوم بفضل الله سوف نقوم بشرح الخاصية bottom وهي تشبه بشكل كبير الخاصية line-height إلا أن خاصية line-height مسئولة عن تحريك السطر المكتوب لأعلى ,,
أما عن الخاصية bottom فهي مسئولة عن تحريك الصور لأعلى او اسفل بشكل بسيط
افتح صفحة تكست فارغة واعطها الامتداد html و ضع فيها هذا الكود ..
<!DOCTYPE html>
<html>
<head>
<style>
div{
border:1px solid #ccc;
width:200px;
}
img.ex2{
position:relative;
bottom:0px;
}
</style>
</head>
<body>
<div>
<h1>Mini Soft</h1>
<img class="ex2" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjF-Jeo15030faMY1I13DwXOVCLqYMfly_DigAvYsZzF00FAy3RDCHLeKHfXd14DDBdJ1-KuF5ri9cvf65grNdJ3zmslgsWnzvPxv1RaN7GEN1PlPspvksOH82rQMemiqKAol_FxTteCUxZ/w43-h42-no/Smile+%25282%2529.png">
</div>
</body>
</html>الآن اغلق هذه الصفحة بعد حفظها ثم قم بفتحها على متصفح انترنت لترى الآتي :
انظر هذه الصورة وانظر السطر الاحمر في الكود السابق , السطر المظلل بالاحمر هو bottom:0px
تعالوا نقوم بتغيير قيمة هذا الكود ولنجعله مثلاً 20px ثم طبق الكود على المتصفح لترى التالي .
لاحظ صورة الوجة الاصفر وقد تحركت للأعلى بمقدار 20px
وهذه هي خاصية اليوم bottom وارجو ان اكون قد وفقت في الشرح
اي استفسار اخوتي لا ترددوا في ترك تعليق
نراكم على خير
Right here is the perfect site for anyone who hopes to understand this topic.
ردحذفYou know a whole lot its almost hard to argue with you (not that I really will
need to…HaHa). You certainly put a brand new spin on a topic that's been discussed
for years. Great stuff, just excellent!
my blog post; motorhome