طراحي وب در نگاه اول كار سخت و پيچيدهاي به نظر ميآيد. ولي اگر با يك همراه خوب و آموزش بهتر اين كار را شروع كنيم شايد بتوانيم با كمي پشتكار و تمرين، خودمان صفحات وب مورد نظرمان را به آساني طراحي و اجرا كنيم. زوميت براي شما عزيزان آموزش HTML را تدارك ديده تا شما را در شروع اين راه ياري كند. پس با ما در دومين بخش از اين آموزش همراه شويد.
آشنايي با تگها - پاراگراف يا
فرض كنيد كه قصد طراحي يك صفحه داريد و براي اين كار بايد چند جمله بنويسيد. براي مثال ميخواهيد بنويسيد كه «من در حال يادگيري HTML از زوميت هستم». براي نوشتن جمله در اچتيامال نيازمند ايجاد يك تگ پاراگراف كه با مشخص ميشود، هستيم. همانطور كه پيش از اين نيز گفتيم، براي نوشتن تگها يك تگ ابتدايي داريم و يك تگ انتهايي. تگ
نيز از اين قاعده مستثني نيست و يك بار باز ميشود، بعد محتوا در بين آن قرار ميگيرد و بعد بسته ميشود. پس ما نيز براي نوشتن يك جمله بايد از
جمله مورد نظر
استفاده كنيم و محتوياتمان را بين آنها بنويسيم.
به مثال زير نگاه كنيد:
نمونه
همه چي آرومه!
من به دنبال يادگيري طراحي وب با زوميت هستم
نتيجهاي كه مرورگر نمايش خواهد داد
همه چي آرومه!
من در حال يادگيري طراحي وب با زوميت هستم
نكات ديگر در رابطه با تگ ...
تگ Pre: زماني كه يك تگ مورد استفاده قرار ميگيرد، اسپيس بين حروف يا متون ديده نميشود. در واقع دو جمله زير در حين نمايش هيچ تفاوتي نميكنند، چرا كه تگ فاصلههاي اضافي را ناديده ميگيرد و همه چيز را سر هم نشان ميدهد.
نمونه
متن ما به صورت پشت سر هم به نمايش در ميآيد
متن با فا صله هاي فراوان فرقي براي تگ پاراگراف نمي كند
متن با فا صله هاي فراوان در اين تگ دقيقا به همان شكلي كه نوشته ميشوند به نمايش ميآيند
نتيجهاي كه مرورگر نمايش خواهد داد
متن ما به صورت پشت سر هم به نمايش در ميآيد
متن با فاصله هاي فراوان فرقي براي تگ پاراگراف ندارد.
متن با فا صله هاي فراوان در اين تگ دقيقا به همان شكلي كه نوشته ميشوند به نمايش ميآيند
همانطور كه مشاهده كرديد، در واقع در اچتيامال اينتر زدن و اسپيسهاي اضافه در بين تگ P
پاراگراف معنا ندارد و اين تگ همه چيز را در كنار هم نمايش ميدهد. پس براي نوشتن متني كه نميخواهيم كلمات به هم پيوسته باشند و بين آنها فاصله باشد، چكار بايد كرد? براي اين كار ميتوان از تگ
به جاي
استفاده كرد. اين تگ هر آنچه و با هر ترتيبي كه بنويسيد، همانگونه نمايش ميدهد. از اين تگ براي بسياري از كارها از جمله نمايش يك كد در صفحه يا متون شعري استفاده ميشود. همچنين اين تگ معمولا با فونت Courier به نمايش در ميآيد.
تگ
: در واقع تگ
(بدون تگ پاياني و تنها با همين تگ و شمايل نوشته ميشود) نقش اينتر در كيبورد را بازي ميكند و متن را يك خط به پايين ميبرد. از اين تگ ميتوان براي اينتر زدن در متن يا به طور كلي ايجاد يك خط جديد در هر المان اچتيامال استفاده نمود.
نمونه
متني كه بعد از تگ بي آر
نتيجهاي كه مرورگر نمايش خواهد داد
متني كه بعد از تگ بي آر
قرار ميگيرد به خط بعدي ميرود.
خلاصه قسمت دوم:
در اين قسمت چيزهايي كه يادگرفتهايم را به صورت كاملا خلاصه مرور ميكنيم.
- در دومين قسمت از سري آموزش HTML و سياساس با نحوه ايجاد يك پاراگراف متن در صفحه اچتيام ال آشنا شديم و دانستيم كه براي نوشتن متن از تگ
content
.- همچنين متوجه شديم كه تگهاي pre متن را دقيقا همان صورتي كه نوشته ميشوند نمايش داده ميشوند ولي تگهاي p اسپيس و فاصلهها را در بين متن نشان نميدهد و در عوض متن را به صورت يكپارچه نشان ميدهد.
نوبت شما:
از آنجا كه هيچ كاري بدون تمرين كردن فايده ندارد، پس وقت آن رسيده تا خودتان دست به كار شويد و آنچه فرا گرفتهايد را امتحان كنيد. ما براي راحتي هر چه بيشتر، يك اديتور آنلاين در صفحه ايجاد كردهايم كه با كمك آن ميتوانيد به تمرين اچتيامال بپردازيد. در ضمن نگران فراموش كردن نباشيد! آموزشهاي جلسه قبل در كنار آموزشهاي بالا هر وقت كه دوست داشته باشيد، در اختيار شما است.
پروژه اين جلسه:
- يك جمله دلخواه را با كمك تگهاي P بنويسيد (براي تمرين بيشتر توصيه ميكنيم كه تگهاي اصلي صفحه HTML كه در سري اول برايتان بازگو كرديم را در ابتداي صفحه يادداشت نماييد.) مثلا:
من در حال يادگيري اچتيامال هستم
- حالا همين جمله را بار ديگر اما با اسپيس زياد بين كلمات و با كمك تگ p بنويسد! مثلا:
من به دنبال يا دگيري برنامه نويسي هستم
- بار ديگر جمله را با اسپيس زياد بين كلمات ولي با كمك تگ pre بنويسد! مثلا:
من بدنبال يا دگيري برنامه نويسي هستم