معرفي مطالب جالب با لينك منبع

در خدمتتان هستيم . درين نصيب براي درج استايل ( css style ) به وبسايت 2 روش embedded و externalرا به طور كامل توضيح خواهم اعطا كرد . به اعتقاد اين نصيب يادگرفتن قادر است تحولي در روش پباده سازي شما ساخت نمايد . پس تا پايان با ما باشيد و مارا ايده ها خودتان محروم نكنيد .
Embedded Style

طراحي سايت در مشهد
در گرد هم آيي قبلي با استايل inline آشنا شديد . البته اين , روش قابل قبولي براي دادن ظواهر به وب سايت نيست و ميبايست از طريق ديگري استفاده كرد . به صورت نمونه بايد استايل را در جايي نوشت و به همگي تگ ها اعلام‌كرد از آن استايل خاص براي ظواهر خودشان استفاده نمايند .براي اين فعاليت كافي است درون تگ head بر بالاي ورقه عنصر style را بيش تر كنيم :


” Content - Type ”content= ” text/html; charset=utf - 8″/>


در نمونه بالا گفته شد براي همگي تگ هاي p سايزفونت 12px را در لحاظ بگير . توجه نمائيد p يك selector است و اعلان ها باطن {} قرار مي‌گيرد .در‌اين نمونه selector ما يك تگ p را انگيزه قرار داده است و مي‌تواند تگ هاي ديگري و يا اين كه كلاس هاي و يا اين كه آي دي هاي ديگري را انگيزه قرار دهد . همينطور براي يك selector ميتوان يك سري اعلان تعريف كرد نظير نمونه زير :


صورت زير ميتواند ياري دهد :
design - web - 53 . jpg
چرا embedded style از inline style خوبتر است؟
فرض فرماييد در ورقه 10 تگ p داريد كه مي‌خواهيد به آن رنگ قرمز‌رنگ بدهيد . در صورتي‌كه كه از inline style استفاده كنيد بايد 10 رتبه اين فعاليت را انجام دهيد و البته درصورتي كه از embedded استفاده فرمائيد فقط كافي است يك توشه آن را بالاي برگه بيشتر فرمائيد تا همگي ي تگ هاي p ازآن تبعيت نمايند .اهميت اين گزينش در حين تغييرات استايل نمايان خيس است چون در صورت استفاده از inline بدون چاره خواهيد بود كليه 10 مورد را تغيير و تحول دهيد ولي در embedded فقط تغييرات در يك مكان صورت ميگيرد .


پس تا اينجا embedded چيره شده است!
هم اكنون فرض فرماييد صفحه ها فراوان متعددي داريد و مي‌خواهيد در همه صفحه ها رنگ كليه ي p ها را قرمز‌رنگ نمائيد . آيا استفاده از embedded مقرون به صرفه است ؟
Extended Style
اين به عبارتي پاسخ سوال بالاست . با external مي‌توانيد يك استايل را براي تمام صفحه ها داشته باشيد و تنها كافي است اين فولدر را به برگه متبوع وصل فرماييد .اما عوارض بيشتري نيز براي گزينش external موجود است كه در زمان توسعه يافته خواهم بيان كرد .
طرز ساخت يك External CSS :
اديتور خويش را گشوده فرمائيد و نوشته css خويش را در آن بنويسيد
/*CSS for Bubble Under site*/p {font - weight : bold;color : blue;}
بعد فولدر را با اسم style1 . css ذخيره فرماييد به عبارتي طوري كه پوشه html را ذخيره نموديد . اكنون بايستي پوشه تشكيل شده را به برگه متصل فرماييد .نكته : فوايد استفاده از كامنت در css همانند html است و براي تفكيك كد هاي css در پروژه هاي بزرگ و گروهي استفاده ميشود . براي اين مراد از عبارت زير استفاده ميكنيم :
/* comment hear */
افزودن external css به صفحه ها html :
براي اين عمل از عنصر link باطن تگhead استفاده مي‌كنيم بنابراين :


” Content - Type ”content= ” text/html; charset=utf - 8″/>” style1 . css ” rel= ” stylesheet ” type= ” text/css ” />

Href به فولدر css شما اشاره مي نمايد . عنصرها rel , type به مرورگر اعلام ميكند جور پيوند شما چه چيزي است تا مرورگر محتواي ورقه را طبق آن تهيه نمايد .نكته : عنصر لينك و پيوند يك تگ empty است و نميتوان آن را در Xhtml به طور container نوشت .پس سود ميگيريم كه external css در پباده سازي وب سايت ها از تمامي مطلوب خيس است و صرفا در مواقعي مجبوريم كه از inline و يا اين كه embedded استفاده كنيم . براي اينكه فهم اين مقاله براي شما بي آلايش خيس باشد به تارنما خودم چند بزنيد و سورس 2 و يا اين كه 3 برگه آن را مشاهده فرمائيد ( براي ديدن تصوير بزرگ روي هر نصوير كليك فرماييد ) :
ورقه نخستين :
فراگيري پباده سازي اينترنت
ورقه دوم :
فراگيري پباده سازي تارنمامي توانيد مشاهده كنيد كه كليه صفحه هاي به يك css وصل گرديده اند .
در صورتيكه به 2 تصوير بالا توجه فرماييد و يا اين كه سورس وبسايت را مشاهده كنيد , متوجه عنصري به اسم media خواهيد شد .به صورت خلاصه اين عنصر براي انگيزه قراردادن سي اس اس براي مدياي خاص مانند screen و يا اين كه تلفن همراه و يا اين كه به عنوان مثال ظواهر ورقه در طول پرينت است . نظير مدام سفارش مي‌كنم در اين زمينه بيشتر تحقيق نمائيد .نكته :آدرسي كه در نمونه بالا براي css مشاهده مي فرمائيد يك نشاني دهي مطلق است كه استفاده از آن بري شما ضرورتي ندارد . يعني در حالتي‌كه فولدر css شما كنار پوشه html شماست بايستي از طريق زير استفاده كنيد :
” style1 . css ” rel= ” stylesheet ” type= ” text/css ” />
در نشست آتي وارد مشاجره css مي شويم و طريق نوشتن استايل براي موادتشكيل دهنده گوناگون برگه را مرور مي‌كنيم .مانند مدام درانتظار نظرها نقدها و ولي پيشنهادات شما هستم و اين كامنت ها و نيز چنين استقبال شماست كه مارا به ادامه فعاليتدلگرم خواهد كرد .
ادامه دارااست در صورتيكه موردپسند قرار گيرد!

در خدمتتان هستيم . درين نصيب براي درج استايل ( css style ) به وبسايت 2 روش embedded و externalرا به طور كامل توضيح خواهم اعطا كرد . به اعتقاد اين نصيب يادگرفتن قادر است تحولي در روش پباده سازي شما ساخت نمايد . پس تا پايان با ما باشيد و مارا ايده ها خودتان محروم نكنيد .
Embedded Style

طراحي سايت در مشهد
در گرد هم آيي قبلي با استايل inline آشنا شديد . البته اين , روش قابل قبولي براي دادن ظواهر به وب سايت نيست و ميبايست از طريق ديگري استفاده كرد . به صورت نمونه بايد استايل را در جايي نوشت و به همگي تگ ها اعلام‌كرد از آن استايل خاص براي ظواهر خودشان استفاده نمايند .براي اين فعاليت كافي است درون تگ head بر بالاي ورقه عنصر style را بيش تر كنيم :


” Content - Type ”content= ” text/html; charset=utf - 8″/>


در نمونه بالا گفته شد براي همگي تگ هاي p سايزفونت 12px را در لحاظ بگير . توجه نمائيد p يك selector است و اعلان ها باطن {} قرار مي‌گيرد .در‌اين نمونه selector ما يك تگ p را انگيزه قرار داده است و مي‌تواند تگ هاي ديگري و يا اين كه كلاس هاي و يا اين كه آي دي هاي ديگري را انگيزه قرار دهد . همينطور براي يك selector ميتوان يك سري اعلان تعريف كرد نظير نمونه زير :


صورت زير ميتواند ياري دهد :
design - web - 53 . jpg
چرا embedded style از inline style خوبتر است؟
فرض فرماييد در ورقه 10 تگ p داريد كه مي‌خواهيد به آن رنگ قرمز‌رنگ بدهيد . در صورتي‌كه كه از inline style استفاده كنيد بايد 10 رتبه اين فعاليت را انجام دهيد و البته درصورتي كه از embedded استفاده فرمائيد فقط كافي است يك توشه آن را بالاي برگه بيشتر فرمائيد تا همگي ي تگ هاي p ازآن تبعيت نمايند .اهميت اين گزينش در حين تغييرات استايل نمايان خيس است چون در صورت استفاده از inline بدون چاره خواهيد بود كليه 10 مورد را تغيير و تحول دهيد ولي در embedded فقط تغييرات در يك مكان صورت ميگيرد .


پس تا اينجا embedded چيره شده است!
هم اكنون فرض فرماييد صفحه ها فراوان متعددي داريد و مي‌خواهيد در همه صفحه ها رنگ كليه ي p ها را قرمز‌رنگ نمائيد . آيا استفاده از embedded مقرون به صرفه است ؟
Extended Style
اين به عبارتي پاسخ سوال بالاست . با external مي‌توانيد يك استايل را براي تمام صفحه ها داشته باشيد و تنها كافي است اين فولدر را به برگه متبوع وصل فرماييد .اما عوارض بيشتري نيز براي گزينش external موجود است كه در زمان توسعه يافته خواهم بيان كرد .
طرز ساخت يك External CSS :
اديتور خويش را گشوده فرمائيد و نوشته css خويش را در آن بنويسيد
/*CSS for Bubble Under site*/p {font - weight : bold;color : blue;}
بعد فولدر را با اسم style1 . css ذخيره فرماييد به عبارتي طوري كه پوشه html را ذخيره نموديد . اكنون بايستي پوشه تشكيل شده را به برگه متصل فرماييد .نكته : فوايد استفاده از كامنت در css همانند html است و براي تفكيك كد هاي css در پروژه هاي بزرگ و گروهي استفاده ميشود . براي اين مراد از عبارت زير استفاده ميكنيم :
/* comment hear */
افزودن external css به صفحه ها html :
براي اين عمل از عنصر link باطن تگhead استفاده مي‌كنيم بنابراين :


” Content - Type ”content= ” text/html; charset=utf - 8″/>” style1 . css ” rel= ” stylesheet ” type= ” text/css ” />

Href به فولدر css شما اشاره مي نمايد . عنصرها rel , type به مرورگر اعلام ميكند جور پيوند شما چه چيزي است تا مرورگر محتواي ورقه را طبق آن تهيه نمايد .نكته : عنصر لينك و پيوند يك تگ empty است و نميتوان آن را در Xhtml به طور container نوشت .پس سود ميگيريم كه external css در پباده سازي وب سايت ها از تمامي مطلوب خيس است و صرفا در مواقعي مجبوريم كه از inline و يا اين كه embedded استفاده كنيم . براي اينكه فهم اين مقاله براي شما بي آلايش خيس باشد به تارنما خودم چند بزنيد و سورس 2 و يا اين كه 3 برگه آن را مشاهده فرمائيد ( براي ديدن تصوير بزرگ روي هر نصوير كليك فرماييد ) :
ورقه نخستين :
فراگيري پباده سازي اينترنت
ورقه دوم :
فراگيري پباده سازي تارنمامي توانيد مشاهده كنيد كه كليه صفحه هاي به يك css وصل گرديده اند .
در صورتيكه به 2 تصوير بالا توجه فرماييد و يا اين كه سورس وبسايت را مشاهده كنيد , متوجه عنصري به اسم media خواهيد شد .به صورت خلاصه اين عنصر براي انگيزه قراردادن سي اس اس براي مدياي خاص مانند screen و يا اين كه تلفن همراه و يا اين كه به عنوان مثال ظواهر ورقه در طول پرينت است . نظير مدام سفارش مي‌كنم در اين زمينه بيشتر تحقيق نمائيد .نكته :آدرسي كه در نمونه بالا براي css مشاهده مي فرمائيد يك نشاني دهي مطلق است كه استفاده از آن بري شما ضرورتي ندارد . يعني در حالتي‌كه فولدر css شما كنار پوشه html شماست بايستي از طريق زير استفاده كنيد :
” style1 . css ” rel= ” stylesheet ” type= ” text/css ” />
در نشست آتي وارد مشاجره css مي شويم و طريق نوشتن استايل براي موادتشكيل دهنده گوناگون برگه را مرور مي‌كنيم .مانند مدام درانتظار نظرها نقدها و ولي پيشنهادات شما هستم و اين كامنت ها و نيز چنين استقبال شماست كه مارا به ادامه فعاليتدلگرم خواهد كرد .
ادامه دارااست در صورتيكه موردپسند قرار گيرد!