«
»

tips باستعمال css

الجمعة 21 نوفمبر 2008

هذه الطريقة لها عدة استعمالات:
عندما تصمم صفحة تحتوي على نص طويل مثل حقوق الملكية والفكرية، ولا تريد وضع هذا النص في رابط خارجي بل في نفس الصفحة، كما في صحفة التسجيل في بريد gmail ..

أو عندما تريد عرض بيانات طويلة ولا تريد أن تأخذ مساحة كبيرة في أسفل الموقع، مثل التعليقات مثلا ..


مثال مباشر

في 3 خطوات بسيطة، سنقوم بتصميم box يحتوي على النص الطويل، ونعطيه الخصائص التالية:

border: 1px solid #ddd;
height: 150px;
overflow: auto;

اطار لتحديد box الذي يحتوي على النص، ثم تحديد الارتفاع وهذا مهم والا لن تحصل على تاثير scroll واخيرا الخاصية overflow: auto كي نضمن ظهور كامل النص داخل box

هناك طريقة أفضل من هذه باستعمال الخاصية scroll كالتالي:

overflow: scroll;
height: 150px;

وكي نخفي المسطرة الافقية نضيف الخاصية overflow: auto ..

يمكن وضع نصوص، صور، تعليقات … داخل box كما يمكن استعمال أي وسوم مثل p ..

7 تعليقات

  1. خير الدين قال:
    21 نوفمبر 2008 الساعة 20:59

    بارك الله فيك اخي
    طريقة فعالة في وضع قوانين الإستخدام في نفس صفحة التسجيل
    ———
    لقد بدات أستخدم google reader :)

  2. warzazi قال:
    21 نوفمبر 2008 الساعة 21:40

    درس بسيط و جميل, لكن عندي سؤال!
    يعني في ال html لدينا إمكانية استعمال ال iframes لكن ال xhtml لا أظنها متوافقة مع هذه الطريقة, فما السبيل إذن لإدراج صفحة ويب أخرى داخل صفحة أخرى كبديل لل iframes ؟؟

    ———————————————————————————————————

    و بخصوص ردي في هاته الصفحة http://www.cssbit.com/archives/864#comments
    أتمنى أن ترسل لي تلك الدروس و شكرا لك !!

  3. warzazi قال:
    21 نوفمبر 2008 الساعة 21:47

    شكرا لك على الدرس السهل الجميل
    لي سؤال و هو هل يمكننا استعمال هذه التقنية كبديل لل iframes في ال html لأنها غير متوافقة مع الxhtml على ما أظن !
    و عموما شكرا لك على كل مواضيع التي تتحفنا بها كل يوم و خصوصا كونك مغربيا فهذا يزيدني فخرا

    شكرا لك

  4. وليد قال:
    21 نوفمبر 2008 الساعة 23:24

    درس جميل ومفيد :)

    استمر بالدروس الممتعه

  5. cssbit قال:
    22 نوفمبر 2008 الساعة 00:16

    العفو يا إخوان

    بخصوص سءالك عن iframe فهي طريقة بدائية ولا تحترم المعايير القياسية الحديثة
    للاسف لا تستطيع ادماج صفحة خارجية بهذه الطريقة وانما محتويات من نفس الصفحة
    هذا ان كنت فهمت استفسارك جيدا

    ام لعلك تقصد شيئا آخر ؟

  6. أزهار قلبي قال:
    22 نوفمبر 2008 الساعة 13:58

    درس متألق

    شكرا أخي الغالي

  7. النية قال:
    23 نوفمبر 2008 الساعة 16:12

    شكرا على الدرس الرائع

التعليقات مغلقة.