منتديات رحيل القمر
اهلا بك زائرنا الكريم يشرفنا انضمامك الينا في منتدى رحيل القمر ..لتترك معنا بصمتك ..فلا ترحل دون

ان نرى بريق اسمك معنا ..يحلق في سماء منتدانا المتواضع ..وشكرا لك









أهلا وسهلا بك إلى منتديات رحيل القمر.
أهلا وسهلا بك زائرنا الكريم، إذا كانت هذه زيارتك الأولى للمنتدى، فيرجى التكرم بزيارة صفحة التعليمـــات، بالضغط هنا.كما يشرفنا أن تقوم بالتسجيل بالضغط هنا إذا رغبت بالمشاركة في المنتدى، أما إذا رغبت بقراءة المواضيع والإطلاع فتفضل بزيارة القسم الذي ترغب أدناه.




آخر المواضيع
الموضوع
تاريخ ارسال المشاركة
بواسطة
شارك اصدقائك شارك اصدقائك شقق مميزة للبيع في دبي
شارك اصدقائك شارك اصدقائك دليلك الشامل للسياح العرب المسافرون لأهم مدن السياحة في كل من الشمال التركي واسطنبول
شارك اصدقائك شارك اصدقائك شركة البيوت نقل اثاث بالرياض
شارك اصدقائك شارك اصدقائك دليلك الشامل للسياح العرب في تركيا
شارك اصدقائك شارك اصدقائك تمويل شخصي اضافي بدون تحويل راتب
شارك اصدقائك شارك اصدقائك عقارات للبيع في الامارات
شارك اصدقائك شارك اصدقائك تملك في مشروع (فلل البحر) مدينة الشارقة
شارك اصدقائك شارك اصدقائك نقل عفش
شارك اصدقائك شارك اصدقائك ضفاف الخليج للخدمات
شارك اصدقائك شارك اصدقائك زيت الحشيش الافغاني الاصلي
أمس في 19:30
الثلاثاء 22 مايو 2018, 01:25
السبت 19 مايو 2018, 19:39
السبت 19 مايو 2018, 19:04
الخميس 17 مايو 2018, 18:28
الأربعاء 16 مايو 2018, 17:51
الجمعة 11 مايو 2018, 23:33
الجمعة 11 مايو 2018, 23:31
الجمعة 11 مايو 2018, 22:54
الجمعة 11 مايو 2018, 21:39
سمير رامي
المصممة ملاك
سمير رامي
سمير رامي
المصممة ملاك
سمير رامي
سمير رامي
سمير رامي
سمير رامي
سمير رامي

منتديات رحيل القمر :: العلوم والتقنية :: تطوير المواقع وعروض المنتدي :: ما يختص باالمواقع

شاطر

الجمعة 02 مايو 2014, 20:36
المشاركة رقم:
غادة الكامليا
المراقب العام

avatar

إحصائيةالعضو

عدد المساهمات : 5440
تاريخ التسجيل : 27/08/2013
نقاط : 16861
السٌّمعَة : 13
العمر : 33
المزاج : .
مُساهمةموضوع: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم






الحَمْد للّٰه رَبّ العالَمَيْنِ وَالصَلاَة وَالسَلام عَلَى أُشرِف خُلْق اللّٰه المُرْسَلِيْنَ
وَعَلِيّ ال بَيْتهُ الطاهِرَيْنِ وَأَصْحابهُ أَجْمَعَيْنِ إِلَى يَوْم أَلَدَّيْنِ صَلاَة لا حَصْر
لَها ڤِي كُلّ لَحْظَة وَلِمَحَّة وَنَفَّسا عَدَد ما وَسَّعَهُ عِلْمكِ وَخْطهُ قَلَّمَكِ وَأَحْصاهُ
كُتّابكِ وَعَدَد ما كَآن وَعَدَد ما يَكُون وَعَدَد الخَطَرات وَالحَرَكات وَالسُكُون
كَمّاً لا نِهايَةً لِكَمالكِ وَعَدَد كَمالهُ ي أُرَحِّم الراحمين أَمِين
اللَهِم أُحْفِظ المُسْلِمِيْنَ وَالمُسْلِمات مَن أَلَّفتُنَّ ما ظَهَّرَ مِنها وَما بِطُنّ
اللَهِم حَبَّبَ الإِسْلام ڤِي قَلُوب الغافِلِيْنَ وَالكافِرِيْنَ وَالمُلْحِدِيْنَ وَالشَياطِين
######

كيفكم حبايبي ي رب تكونو بخير (ادارين - ومشرفين - ومساعدين - واعضاء وزوار+عناكب جوجل)
بعد غياب طال طال <~ رجعنا لكم بشرح حصري وطريقه حصريه للديف بوينت

وهي تتلخص في:~
جعل الصوره الرمزيه بشكل دائري
بدون التغير في حجمها وجعلها بشكل انيق ومميز
ملاحظه( الطريقه ليست فقط للصوره الرمزيه تقدر تستخدمها في اي مكان )

الحين ننتقل للشرح<~ ويا رب اتوفق ويكون عند حسن ظنكم

اولا نستعرض مثال للدرس

اولا صوره قبل وضع الكود
~~




بعد وضع الكود وتطبيقه تظهر بهذا الشكل <~ حلوه صح




وعند مرور الماوس على الصوره تظهر بهذا الشكل
(لا يوجد اختلاف كثير فقط الاختلاف في لون الاطار)



ملاحظه عند الضغط كلك يمين على الصوره وفتح الصوره بـ اسم
تفتح الصوره الاساسيه ولا يتغير حجمها





الحين نجي للشرح<~ ترا بسيط وسهل بس انا مسوي زحمه وكذا

1- ندخل لوحة التحكم

2- البحث في القوالب




3- من المستطيل اللي فوق نختار الاستايل المراد التعديل فيه

4- نضع في مربع البحث اسم القالب اللي هو"postbit_legacy"

ونضغط زر "بحث"




5- يظهر لنا قالب الـ
"postbit_legacy"
6- نضغط عليه مرتين للتعديل عليه"





7- بعد فتح القالب نضغط في الكيبورد [b]"Ctrl+F[/b]"
ونكتب في مستطيل البحث "avatar"





8-بيظهر بهذا الشكل
9- نقوم بتحديد الكود اللي معلم عليه بالازرق ابتداء من

"<div class="smallfont">"
ونستمر بالتحديد حتى كلمة
"</dev>"
كما في الصوره ادناه




10- نقوم بحذف الكود اللي حددناه من شوي

11- نستبدله بهذا الكود


كود C#
?
1
2
3
الكود:
<div
الكود:
class
الكود:
=
الكود:
"smallfont"
الكود:
>
الكود:
                   
الكود:
&nbsp;<a
الكود:
class
الكود:
=
الكود:
"circle"

الكود:
href=
الكود:
"member.php?$session[sessionurl]u=$post[userid]"
الكود:
> <img height=
الكود:
"200"

الكود:
width=
الكود:
"200"

الكود:
src=
الكود:
"$post[avatarurl]"

الكود:
$post[avwidth] $post[avheight] alt=
الكود:
"<phrase 1="
الكود:
$post[username]
الكود:
">$vbphrase[xs_avatar]</phrase>"

الكود:
border=
الكود:
"0"

الكود:
/></a>
الكود:
               
الكود:
</div>



ملاحظه :لتغير الحجم نغيره من هذا الكود

كود C++
?
1
2
الكود:
height=
الكود:
"200"
الكود:
width=
الكود:
"200"





12- نحط الكود السابق مكان اللي حذفناه ونضغط #حفظ[b]#
ليصبح بالشكل في الصوره ادناه
[/b]





13- الحين نتوجه الى تركيب اكواد "css"لوحة التحكم

14- الاستايلاات والقوالب

15- التحكم بالاستايلات




16- نختار الاستايل المراد التعديل عليه وبجانبه يوجد قائمه منسدله

(خيارات جميع الاستايلات)




17- بعد ضغط على قائمة (خيارات جميع الاستايلات)
نختار من القائمه "css رئيسي"




18- ننزل الى اخر الصفحه
(
تعاريف CSS الإضافية/Additional CSS Definitions)

في اخر مستطيل نضع هذا الكود

كود C#
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
الكود:
/* خاص للديف بوينت deel711 */
   
الكود:
body .circle  {
الكود:
  
الكود:
background: #003322;
الكود:
/* لون خلفية الصوره(اذا كانت خلفيتها شفافه فقط)*/
الكود:
    
الكود:
font: 100 14px sans-serif;
الكود:
    
الكود:
color: #000;
الكود:
  
الكود:
text-shadow: 0 1px 1px rgba(255,255,255,0.1);
الكود:
    
الكود:
text-align: center;   
الكود:
}
الكود:
::-moz-selection {
الكود:
  
الكود:
background: rgba(0,0,0,0.1);
الكود:
}
الكود:
::selection {
الكود:
  
الكود:
background: rgba(0,0,0,0.1);
الكود:
}
الكود:
.circle h1 {
الكود:
  
الكود:
font-weight: 100;
الكود:
  
الكود:
font-size: 2.7em;
الكود:
}
الكود:
.circle h3 {
الكود:
  
الكود:
color: #111222;
الكود:
  
الكود:
font-size: 1.6em;
الكود:
}
الكود:
.circle a {
الكود:
  
الكود:
color: RoyalBlue;
الكود:
  
الكود:
font-weight: normal;
الكود:
  
الكود:
text-decoration: none;
الكود:
}
الكود:
.circle a:hover {
الكود:
  
الكود:
color: CornflowerBlue;
الكود:
}
 
الكود:
/* خصائص الدائره  */
 
الكود:
.circle {
الكود:
    
الكود:
line-height: 0;       
الكود:
    
الكود:
display: inline-block;   
الكود:
/* تناسق الدائره مع الصوره */
الكود:
    
الكود:
margin: 5px;
الكود:
  
الكود:
border: 2px solid rgba(255,255,255,0.4);
الكود:
/* حجم ولون ونوع الحدود الخارجيه للصوره*/
الكود:
    
الكود:
border-radius: 50%;   
الكود:
/*الانحنا للحدود بالنسبه المئويه */
الكود:
    
الكود:
/*box-shadow: 0px 0px 5px rgba(0,0,0,0.4);*/
   
الكود:
/* اذا اردت عمل ظل للدائرهل شيلةعلامة /8 من امام وخلف الكود المقابل*/
الكود:
    
الكود:
transition: linear 0.25s;
الكود:
  
الكود:
height: 200px;
الكود:
  
الكود:
width: 200px;
الكود:
}
الكود:
.circle img {
الكود:
    
الكود:
border-radius: 50%;   
الكود:
/* حجم الصوره بالنسبه المئويه */
الكود:
}
الكود:
.circle:hover {
الكود:
    
الكود:
transition: ease-
الكود:
out

الكود:
0.2s;
الكود:
  
الكود:
border: 2px solid rgba(215, 40, 40, 0.9);
الكود:
/*لون الحدود عند مرور الماوس */
الكود:
  
الكود:
-webkit-transition: ease-
الكود:
out

الكود:
0.2s;
الكود:
}
الكود:
.circle a{
الكود:
  
الكود:
color: transparent;
الكود:
}
الكود:
/* خاص للديف بوينت deel711 */


"للتعديل على خصائص الكود قمت بشرح بجانب كل كود"




19- نقوم بنسخ الكود السابق ثم نضعه في اخر مربع

كما في الصوره ادناه ثم نضغط #حفظ#





20- الرجاء عند النقل ذكر الحقوق(لا اسمح بنقله بدون ذكر الحقوق)



(لتحميل جميع الملفات + الصور الشرح)

الصور
[#]


الاكواد


[#]
# تقبلو خالص تحياتي




توقيع : غادة الكامليا





الثلاثاء 06 مايو 2014, 16:43
المشاركة رقم:
بنت المغرب
كبار الشخصيات

avatar

إحصائيةالعضو

انثى
عدد المساهمات : 2848
تاريخ التسجيل : 22/05/2011
نقاط : 7164
السٌّمعَة : 9
العمر : 39
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


تسلم أناملك على الموضوع الرائع

لا خلا و لا عدم من مواضيعك الجديدة

بإنتظار مواضيعك المميز ة بكل شوق

يعطيك العافية و إلى الأمام


توقيع : بنت المغرب










الثلاثاء 06 مايو 2014, 18:51
المشاركة رقم:
انجلينا جولي
المشرف العــام

avatar

إحصائيةالعضو

انثى
عدد المساهمات : 2070
تاريخ التسجيل : 30/05/2011
نقاط : 5612
السٌّمعَة : 3
العمر : 32
المزاج : بخير
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


تَسلٍـم ألآيآدي
ع أإلموضوع أإلمفيد
الله يـ ع’ـطيگ الــ ع’ـآفيه
مآ ننح’ـرم منگ يآرب
بآنتظـآر ج’ـديدگ



توقيع : انجلينا جولي








الجمعة 23 مايو 2014, 23:45
المشاركة رقم:
حلم الرجال
كبار الشخصيات

avatar

إحصائيةالعضو

ذكر
عدد المساهمات : 6071
تاريخ التسجيل : 19/04/2013
نقاط : 9215
السٌّمعَة : 12
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


بارك الله فيك على هذا الطرح الجميل والمميز

وفي إنتظار جديدك الأروع

لك مني أجمل التحيايا

وكل التوفيق لك يا رب


توقيع : حلم الرجال




مرحبا يا زائر 

اضغط لمشاهدة توقيعي:
 




الإثنين 02 يونيو 2014, 23:20
المشاركة رقم:
Ranim nou7
عضو محترف

avatar

إحصائيةالعضو

عدد المساهمات : 3731
تاريخ التسجيل : 26/08/2013
نقاط : 5800
السٌّمعَة : 16
العمر : 29
المزاج : .
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


موضوع رائع شكلاً ومضموناً




مشكور على مجهودك الرائع



في انتظار جديدك القادم بحول الله


تحياتي الخالصة


توقيع : Ranim nou7





الأحد 22 يونيو 2014, 19:09
المشاركة رقم:
راجية عفو الرحمن
مؤسسة الموقع

avatar

إحصائيةالعضو

انثى
عدد المساهمات : 9863
تاريخ التسجيل : 20/05/2011
نقاط : 17413
السٌّمعَة : 29
العمر : 46
الموقع : قلب احبتي
المزاج : الحمد لله
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


موضوع رائع
شكرا لك وبارك الله فيك
نتمنى تواصلك الدائم
وجديدك المميز


بالتوفيق


توقيع : راجية عفو الرحمن




مرحبا يا زائر 

اضغط لمشاهدة توقيعي:
 




الأربعاء 12 نوفمبر 2014, 20:38
المشاركة رقم:
غادة الكامليا
المراقب العام

avatar

إحصائيةالعضو

عدد المساهمات : 5440
تاريخ التسجيل : 27/08/2013
نقاط : 16861
السٌّمعَة : 13
العمر : 33
المزاج : .
مُساهمةموضوع: رد: جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


جعل الصوره الرمزيه دائريه وتصغيرها بدون التاثير على الحجم


๑♥๑

๑♥๑ شكرا لكم على حضوركـم ๑♥๑

๑♥๑ والله يسلمكم من عذابة ๑♥๑

๑♥๑ شاكر مروركم الجميل ربي يسعدكـم ๑♥๑

๑♥๑



توقيع : غادة الكامليا







الــرد الســـريـع
..





تعليمات المشاركة
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة


جميع آلمشآركآت آلمكتوبه تعبّر عن وجهة نظر صآحبهآ , ولا تعبّر بأي شكل من آلأشكآل عن وجهة نظر إدآرة آلمنتدى