شرح كيفية إضافة ايقونة قبل النص بتقنية Css الـسلام عليكم ورحمة الله وبركاته ، بسم الله الرحمن الرحيم أخـباركم يالغالين ،، إن شاء الله بخير دايـماً .. الأن أقدم لكم ،’ شرح كيفية إضافة ايقونة قبل النص بتقنية Css مثـال مباشر .. Text Icons - Progs4u.net فحص html هنــــا ، فحص css هنــــا ================================================== === اولاً : نضيف كود التالى .. رمز Code: http://www.progs4u.net/vb/attachment...1&d=1312895098 وبعد ذلك نضيف كلاس بإى اسم .. رمز Code: http://www.progs4u.net/vb/attachment...1&d=1312895098 تمـام وبعد ذلك نضيف النص او الكلام .. رمز Code: معهد برامج فور يو http://www.progs4u.net/vb/attachment...1&d=1312895098 كده خلصنا التوزيع ، الأن نكتب اكواد سى اس اس Css نضيف اسم كلاس وبعد ذلك نضيف مسار ايقونة ( صورة ) .. ونضيف كود ايقونة لا تتكرار ( no-repeat ) ونضيف كود المكان ايقونة ( Right ) ملاحظة فى كود المكان : لو النص فى اليمين يبقى نكتب Right علشان نجعل ايقونة فى يمين .. ولو النص فى الشمال يبقى نكتب Left علشان نجعل ايقونة فى شمال .. وبعد ذلك نضيف كود المكان نص Text-align حسب ايقونة .. http://www.progs4u.net/vb/attachment...1&d=1312895745 ده شكل نهائى http://www.progs4u.net/vb/attachment...1&d=1312895651 فى مشكلة صح ، ولكن عادى نضيف كود ابعاد النص Padding لو ايقونة فى يمين نضيف هذا Padding-Right ولو ايقونة فى شمال نضيف هذا Padding-Left طيب ازاى اضف رقم بيسكل ؟ ، طبعا اضف رقم فى مقاس عرض 20px على صورة ( ايقونة ) .. http://www.progs4u.net/vb/attachment...1&d=1312895098 ده شكل نهائى http://www.progs4u.net/vb/attachment...1&d=1312895651 إنتهت ،، تم بحمد لله المصدر : هنـــــــا والـسلام عليكم .. |
الساعة الآن 01:35 PM |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Content Relevant URLs by vBSEO 3.5.2 TranZ By
Almuhajir