الصفحة الرئيسية | اتصل بنا | المواقع | يبدأ استخدام | الموارد | المتجر | أكتب التعليمي
واستنادا إلى البرنامج التعليمي السابقة قررت إنشاء هذا البرنامج التعليمي لشرح كيفية جعل قائمة مع كل من القانون ، ويمكنك استخدامه لأية صفحة بى لديك ، وحتى بالنسبة لأية اتفاقية الأنواع المهاجرة وخاصة وورد الشهير.
1 -- صورة من كل مقطع قطع القائمة.




وسوف 2 -- أن تستخدم هذه الصور في الممتلكات تحوم.




3 -- برنامج دريمويفر (أتش تي أم أل على سبيل المثال).
4 -- بعض المعرفة : المغلق ، وأتش تي أم أل بي.
قبل كل شيء نحن بحاجة لفتح صفحة جديدة وجعل فب بنية أتش تي أم أل من القائمة لدينا ، ونحن سوف إنشاء قوائم أمر :
1 2 3 4 5 6 | "menu" > <!--Comienza Menu--> < li >< a class = "index" href = "index.php" > Home < / a >< / li > < li >< a class = "enviar" href = "enviar.php" > Enviar < / a >< / li > < li >< a class = "contacto" href = "contacto.php" > Contacto < / a >< / li > < li >< a class = "recursos" href = "recursos.php" > Recursos < / a >< / li > < / ul > <!--Termina Menu--> <Ul"menu">معرف = <! -- قائمة ابدأ --> فئة <ahref = <li>"index" = "index.php">الصفحة الرئيسية </ أ> </ لى> <li>فئة = "تقدم" href = "enviar.php"> أرسل </ أ> </ لى> فئة <ahref = <li>"contact"="contacto.php"> الاتصال </ أ> </ لى> <لى > فئة href = <a"resources"="recursos.php"> الموارد </ أ> </ لى> </ خدام> <! -- نهاية القائمة --> |
الآن ، ونحن إضافة إلى معرف <ul>العلامة (السطر الأول) ، ثم نضيف إلى كل فئة <a>تسمية (واحدة مختلفة عن كل وصلة) ، لذلك سيكون لدينا مؤشر ، بريد إلكتروني ، والاتصال مورد.
هذا يكفي لجعل هيكل هتمل من القائمة لدينا ، وحفظ الصفحة index.php وتذهب مع النمط.
فتح صفحة جديدة المغلق.

نحن يبقيه كما style.css ، وعاد إلى صفحة بي إتش بي ل ربط نمط .
بدأنا طريقنا إلى العنصر "*" الذي ، كما هو موضح في شريط فيديو تعليمي بشأن كيفية جعل موضوع وورد من الصفر ، ويستخدم لإضافة ميزات مختلفة لجميع العناصر ، لذلك كل خاصية إضافة النجمة ، سيكون من التي اتخذتها جميع العناصر الموجودة في موقعنا ، وسنقوم بإضافة مجرد هامش والحشو :
1 2 3 4 | : 0 ; padding : 0 ; } * (هامش : 0 ؛ الحشو : 0 ؛) |
وما زلنا مع الهيئة ، ونحن سوف يضع صورة الخلفية التالية لموقعنا على الانترنت على ما يرام من الناحية الجمالية : 
وذلك هو المغلق في الجسم لدينا :
1 2 3 4 5 | : url ( imagenes/bg.png ) repeat-x #333333 ; font-size : 12px ; font-family : Arial , Helvetica , sans-serif ; } الجسم (خلفية : رابط الصور (/ bg.png) كرر س # 333333 ؛ الحجم : 12px ؛ الخط الخط بين أفراد الأسرة : المطلق ، هلفتيكا ، بلا الرقيق ؛) |
حسنا ، إذا كان علينا أن نبدأ الآن لإعطاء النمط إلى القائمة لدينا ، في المقام الأول إلى القائمة "معرف"
1 2 3 4 | # القائمة ( none ; قائمة على غرار : لا شيء ؛ 15px ; هامش قمة : 15px ؛ ) |
تولى قبالة نقطة في بداية كل عنصر في القائمة (السطر 2) وطائفة العلوية للزوج جي ubircarlo (السطر 3).
وما زلنا مع العنصر "لي" ، وهو ما سيضيف فقط خاصية "العرض : مضمنة" ليكون موجودا بجانب بعضها البعض.
1 2 3 | لى القائمة # ( inline ; عرض : المحول ؛ ) |
الآن حان الوقت لتعديل البند "أ" ، وسوف يستغرق الخصائص التالية.
1 2 3 4 5 6 7 8 | # لى القائمة (أ) ( block ; عرض : الكتلة ؛ 60px ; العرض : 60px ؛ 102px ; الطول : 102px ؛ left ; تعويم : غادر ؛ -5000px ; النص المسافة البادئة : - 5000px ؛ 2px ; هامش اليسار : 2px ؛ ) |
العرض والارتفاع من كل صورة (خطوط 3 و 4 على التوالي) ، والملكية تعويم : غادر إلى أن يكون موجودا واحد إلى يمين الأخرى البادئة النص لحذف النص الذي يتم داخل <a>التسمية و الهامش الأيسر للفصل بين القائمة قليلا بعضها البعض.
كنا الآن في كل فئة المسمى "أ". لذلك تركنا.
1 2 3 4 5 6 7 8 9 10 11 12 | { # لى أ فهرس القائمة ( url ( imagenes/home.png ) no-repeat ; خلفية : رابط (الصور / home.png) عدم تكرار ؛ ) { # لى القائمة (أ) تقديم ( url ( imagenes/enviar.png ) no-repeat ; خلفية : رابط (الصور / enviar.png) عدم تكرار ؛ ) { # لى أ الاتصال القائمة ( url ( imagenes/contacto.png ) no-repeat ; خلفية : رابط (الصور / contacto.png) عدم تكرار ؛ ) { # لى القائمة (أ) الموارد ( url ( imagenes/recursos.png ) no-repeat ; خلفية : رابط (الصور / recursos.png) عدم تكرار ؛ ) |
ببساطة إضافة الخلفية لكل عنصر من عناصر.
تواصل مع تحوم : لكل صورة لتغيير كاليفورنيا عندما الماوس فوقها.
1 2 3 4 5 6 7 8 9 10 11 12 | :hover { background : url ( imagenes/home-hover.png ) no-repeat ; } #menu li a .enviar :hover { background : url ( imagenes/enviar-hover.png ) no-repeat ; } #menu li a .contacto :hover { background : url ( imagenes/contacto-hover.png ) no-repeat ; } #menu li a .recursos :hover { background : url ( imagenes/recursos-hover.png ) no-repeat ; } # لى القائمة (أ) الوثيقة : تحوم (خلفية : رابط (الصور / المنزل hover.png) عدم تكرار ؛) # القائمة (أ) أرسل لي : تحوم (خلفية : رابط (الصور / يقدم - hover.png) عدم تكرار ؛) # القائمة (أ) الاتصال لي : تحوم (خلفية : رابط (الصور / الاتصال بين hover.png) عدم تكرار ؛) # لى القائمة (أ) الموارد : تحوم (خلفية : رابط (صور / الموارد - hover.png) لا - تكرار ؛) |
جاهزة ، إضافة ببساطة "تحوم" في نهاية كل عنصر من عناصر وتغيير صورة لكل منهما.
مع ما تم إنجازه حتى الآن فقط ستكون لدينا خيار متاح من تمرير الماوس فوق الصورة. هذا هو المكان الذي يأتي دور بي إتش بي ، كما نفعل حتى أنه وضع علامة القسم من القائمة ما نحن فيه؟ ، ونحن نفعل ذلك ببساطة من خلال إضافة معرف على الجسم.
على سبيل المثال :
1
| "enviar" > <bodyمعرف = "post"> |
إذا كنت لن تستخدم هذه القائمة في وورد أو أي اتفاقية الأنواع المهاجرة الأخرى معرف أضيف الجسم المختلفة من كل صفحة ، والقفز إلى الخطوة التالية دون أن المغلق ، عملتم جسمك مثل هذا :
ملف : index.php
الجسم :
1
| "index" > <bodyمعرف = "index"> |
ملف : enviar.php
الجسم :
1
| "enviar" > <bodyمعرف = "post"> |
ملف : contacto.php
الجسم :
1
| "contacto" > <bodyمعرف = "contact"> |
ملف : recursos.php
الجسم :
1 2 | ] "recursos" > <bodyمعرف = "resources"> |
وكما قلت من قبل ، وإذا قمت بذلك يدويا ، العثور على المغلق أن هذا القسم الجديد في هذا البرنامج التعليمي أدناه.
إذا كنت تستخدم هذه القائمة في وورد ، وستكون لدينا مشكلة ، كما نفعل لإضافة اسم المستخدم إلى كل هيئة من مختلف إذا القائمة في ملف واحد يسمى "header.php" ، أي رأس نفس الملف ك لإرسال والصفحة الرئيسية للاتصال ، ثم نقوم بإضافة رمز فب التالية. لدينا صفحة.
<body>وقبل أن يكتب ما يلي :
1 2 3 4 5 6 7 | = $_SERVER [ 'REQUEST_URI' ] ; $pagina = str_replace ( "/" , "" , $pagina ) ; $pagina = str_replace ( ".php" , "" , $pagina ) ; $pagina = str_replace ( "?s=" , "" , $pagina ) ; $pagina = $pagina ? $pagina : 'default' ?> <؟ بى الصفحة $ = $ _SERVER ['REQUEST_URI'] ، $ صفحة ("/"،= str_replace "" ، $ صفحة) $ = صفحة str_replace ("" بي. "،" ، الصفحة) صفحة $ $ = str_replace ("؟ ق =" ، "" ، صفحة) $ $ $ = صفحة صفحة؟ $ الصفحة : 'الافتراضية'؟> |
ساوضح ما كل سطر :
1 -- افتح رمز فب
2 -- إحضار عنوان الموقع الذي نحن (نتذكر أن رابط وورد يستخدم اكثر في شيء من هذا القبيل "http://www.tublog/tu-pagina/).
3 -- أين ترك مائل "/" سيتم استبدال أي شيء! "."
سيتم استبدال 4 -- أين تذهب بعض. "بى" ، من قبل أي شيء!.
5 -- أين تذهب أي؟ خ = "، وسيتم الاستعاضة عن أي شيء!.
6 -- وتعود هذه النتيجة.
7 -- إغلاق علامة بي.
وذلك ما نقوم به هو اتخاذ رابط وإزالة جميع تلك الأشياء التي لا تخدم لنا لمعرف لدينا.
الآن نذهب إلى الجسم ، ونحن سوف تضيف :
1
| "<?php echo $pagina ?>" > هيئة الهوية <= "<؟ بى صدى دولار الصفحة؟> |
جاهزة! وسوف تتخذ الهيئة معرف للصفحة ما نحن فيه.
ننتقل الآن لدينا إضافة إلى نمط معرف الجسم.
يضاف ما يلي.
1 2 3 4 5 6 7 8 9 10 11 12 | { background : url ( imagenes/home-hover.png ) no-repeat ; } body #enviar #menu li a .enviar { background : url ( imagenes/enviar-hover.png ) no-repeat ; } body #contacto #menu li a .contacto { background : url ( imagenes/contacto-hover.png ) no-repeat ; } body #recursos #menu li a .recursos { background : url ( imagenes/recursos-hover.png ) no-repeat ; } # # مؤشر الهيئة القائمة مؤشر لى أ (خلفية : رابط (الصور / المنزل hover.png) عدم تكرار ؛) هيئة البريد الإلكتروني # # القائمة (أ) يقدم لي (خلفية : رابط (الصور / يقدم - hover.png) لا ، كرر ؛) هيئة # # الاتصال القائمة (أ) اتصل لي (خلفية : رابط (الصور / الاتصال بين hover.png) عدم تكرار ؛) هيئة # # لى القائمة على الموارد. الموارد (خلفية : رابط الصور (/ موارد - تحوم . بابوا نيو غينيا) عدم تكرار ؛) |
جاهزة ، وهذا ما يخبرنا هو أنه عندما يصبح الجسد أي من هذه الهوية (الرقم القياسي وإرسال والاتصال ، والموارد) ، سيجعل من "الطبقة" تأخذ صورة تحوم.
جاهزة! انتهينا من القائمة لدينا على حد سواء كما ورد اتفاقية الأنواع المهاجرة أو أي صفحة أخرى. فب ، الى هنا حيث أترك الرمز البريدي الملفات كلها النهائي.
تحميل والنتيجة من هذا البرنامج التعليمي هنا

مايكل هو الخالق ورئيس تحرير skyandstars.net التي تنشر أدلة ودروس خصوصية لورد ، للتعليقات القادمة ، بي ، أتش تي أم أل ، وأكثر من ذلك. وطالب جامعي الحالي.
عيسى
27 أبريل 2009
أنا بشيء من الارتباك ، أن أرى بلدي القوائم كما أفعل مع دريمويفر ، وهي بالتأكيد أسهل : دإ
وأثار الذهاب ومستوى تعليمي مايكل! أهنئك :)
مايكل
28 أبريل 2009
هاها نعم... هو في الأساس تغيير الصور.. ولكن التأثير كان يريد التأكيد عليها هي أن يتم تمييز في هذه الصفحة.... HACR ورد dificl لأن رأس نفسه الذي يعمل لجميع صفحات...... لان entoncs مع بي لا... وهذا عيسى قبلة =)
عيسى
29 أبريل 2009
Ahm يذهب! سقو أول مرة رأيت لم يترك أي شيء وأبرزت عند النقر على صفحة أخرى ، لماذا الأنف. الآن إذا أراه بشكل مختلف ، في الحقيقة لقد تساءل بعض الأحيان واط لأنه نعم نعم ، أنا أحب هذا البرنامج التعليمي ، وآخر إلى قائمة بالقوانين التي يجب أن أقوم به ، لأنه لا يخدم موقعي أليس كذلك؟
مايكل
30 أبريل 2009
بالطبع : ف فقط أن تفعل ذلك من الهوية ونمط للجسم :)... أو إذا كنت ترغب في وضع تلقائيا الجسم ، وتفعل ذلك مع بي جيدا... ولكن.. هو beso تروق لكم... الأمم المتحدة!
عيسى
30 أبريل 2009
طيب! الكالينجيون
graciebird
30 أبريل 2009
وسوف جيدة جدا توتو استخدام ذلك في المرة القادمة قمت بتغيير النسخة. شكرا لك. بالطبع ترك رسالة على المنتدى مع الكثير من اليأس ، ويمكن أن نأمل أن تساعدني. وقد ساعدت من خلال الموقع لي الكثير.
فران
22 يونيو 2009
أن توتو جيدة ومفيدة جدا ، وشرح بشكل جيد للغاية ، وملفات النهائي. حقا هي محل تقدير