شرح كيفية جعل الصورة تكبر بحجم الشاشة في ال blogger

الان يمكنك عمل خاصية جديدة في البلوجر اذا اكنت بها صور كثيرة وتريد ان تجعل من الصور

شكل جذاب

نذهب الى تصميص / مصمم النمازج / متقدم / اضافة CSS

ونضع هذا الكود ادخل المربع كما بالصورة

.imgcaption {
padding-bottom:10px;
padding-top:30px;
position:relative;
}
.imgcaption cap {
position:absolute;
left:0%;
right:0%;
padding:10px;

background:#dddddd;

color:ffffff;

opacity:0.8 !important;
bottom:6%;
}

ثم نضغط على تطبيق على المدونة
مثال على الصورة وكيفية تشغيل الخاصية
والان علينا بتغيير ما هو باللون الاحمر الى اسم الصورة " هذا مثال "

<div class="imgcaption"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb8HfCIKClvDKDuRBzAww27afJSKJhikQWvffrTalWtNSsOBTahfwHukX9pxzZcQXxM8JOdVI-ByRWMSFl-uIQ5DFHC1Vg5HnHq0L74PnIYfsJlHKupHCm9n59Q8-6yM9eX_yd9JayZDoh/s1600/Desert.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb8HfCIKClvDKDuRBzAww27afJSKJhikQWvffrTalWtNSsOBTahfwHukX9pxzZcQXxM8JOdVI-ByRWMSFl-uIQ5DFHC1Vg5HnHq0L74PnIYfsJlHKupHCm9n59Q8-6yM9eX_yd9JayZDoh/s320/Desert.jpg"/></a><cap>Desert - Picture Of The Desert</cap></div>

مثال اخر مع تغيير رابط الصورة والمسمى التوضيحي لها

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ylIbwuQQoMKic5lA1tikzNmKODn9JuDVdbpqYdXJlIJ-Ep-cVEP8y7K7aOEwbcIkhbSmqG8uM7NkQW6HURNcsR1IECIILMgxhkFS6D643zFnKwezzwQOea1E4IQtahxBTs_OXTxyNg9_/s1600/Lighthouse.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ylIbwuQQoMKic5lA1tikzNmKODn9JuDVdbpqYdXJlIJ-Ep-cVEP8y7K7aOEwbcIkhbSmqG8uM7NkQW6HURNcsR1IECIILMgxhkFS6D643zFnKwezzwQOea1E4IQtahxBTs_OXTxyNg9_/s320/Lighthouse.jpg" width="320" /></a>

مثال اخر

<div class="imgcaption" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ylIbwuQQoMKic5lA1tikzNmKODn9JuDVdbpqYdXJlIJ-Ep-cVEP8y7K7aOEwbcIkhbSmqG8uM7NkQW6HURNcsR1IECIILMgxhkFS6D643zFnKwezzwQOea1E4IQtahxBTs_OXTxyNg9_/s1600/Lighthouse.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-ylIbwuQQoMKic5lA1tikzNmKODn9JuDVdbpqYdXJlIJ-Ep-cVEP8y7K7aOEwbcIkhbSmqG8uM7NkQW6HURNcsR1IECIILMgxhkFS6D643zFnKwezzwQOea1E4IQtahxBTs_OXTxyNg9_/s320/Lighthouse.jpg" width="320" /></a><cap>Lighthouse - Picture Of A Lighthouse</cap></div>

في انتظار اي استفسار
الموضوع حصري لمدونة توب نيو