منظور از اتصال داخلی چیست؟ چگونه کدهای CSS را درون کد های HTML بارگذاری کنیم؟ در این مقاله میخواهیم به نحوه معرفی کدهای CSS به صورت داخلی در HTML بپردازیم.
سرفصلهای پست
اتصال داخلی
در جلسه قبلی با اتصال خارجی کدهای CSS آشنا شدیم و مزایا و معایب آن را بررسی کردیم. در این جلسه میخواهیم با روش اتصال داخلی آشنا شویم.
این روش کمتر مورد استفاده قرار میگیره، چرا که نیاز به فایل CSS جداگونه نیست و ما میتونیم کدهای CSS رو داخل فایل HTML خودمون نگارش کنیم. در نتیجه فایل HTML به شدت شلوغ شده و کار کدنویسی رو برای ما به شدت دشوار میکنه. برای استفاده از این روش، از مراحل زیر استفاده میکنیم:
- همونطور که گفته شد، نیازی به فایل جداگونه CSS نیست. پس در داخل بدنه عنصر head، یک عنصر به نام style معرفی میکنیم:
<head> <style> … … … </style> </head>
حالا کافیه کدهای CSS موردنظرمون رو داخل بدنهی عنصر style بنویسیم.
روش internal به فرم زیر مشاهده میشه.
مزیتهای استفاده از روش اتصال داخلی یا اتصال internal
- از مزیتهای استفاده از روش اتصال داخلی اینه که لازم نیست مدام از یک فایل، به یک فایل دیگه برای ویرایش کدهامون بریم.
- مشکلات کش را ندارد، این روش توسط تمامی مرورگرها خوانده میشود و نگران مشکلات کش در صفحهات خود چه در مرورگرهای جدید و چه قدیمی نخواهید بود.
- استفاده از این روش باعث میشه که درخواستهای HTTP ما کاهش پیدا کنه.
- امکان معرفی شبه عناصر یا شبه ویژگیها در این روش امکان پذیر است.
معایت استفاده از روش اتصال داخلی
- با استفاده از این روش شما تنها به استایل ها در این صفحه دسترسی دارید و برای استفاده مجدد میبایست در صفحات دیگر HTML خود دوباره آنها را بازنویسی کنید.
- با استفاده از این روش با اینکه تعداد فایلهای خارجی کاهش پیدا کرد و درخواستهای HTTP کاهش پیدا میکند ولی حجم صفحه شما افزایش میابد.
- افزایش حجم هر صفحه باعث کاهش سرعت لود صفحه نیز خواهد شد و بر TTFB تاثیر گذار است.
نتیجه
در این مقاله با اتصال داخلی آشنا شدیم و چگونگی آماده سازی آن را بررسی کردیم، مزیتها و معایب آن را بررسی کردیم. در مقاله بعدی با اتصال درون خطی آشنا میشویم.
فراموش نکنید که میتونید تمامی روشها را از طریق برچسب فصل سوم – فراخوانی کدهای CSS در HTML دنبال کنید.
اگه نکته، پیشنهاد و انتقادی در رابطه با آموزشها دارین، خیلی خیلی خوشحال میشیم که اون رو در بخش دیدگاههای پایگاه دانش میزفا ارسال کنین.
مدیر محتوا: علی اسمعیلی
2 پاسخ
سلام
من هر کاری کردم نتونستم در دوره css ثبت نام کنم
کارتون عالیه ولی اینقدر ثبت نامش پیچیده شده که باعث میشه ازش منصرف شویم
سلام خواهش میکنیم
دوره CSS؟ منظورتون میزفا آکادمی هست؟
لطفا قسمتی از ثبت نام که در اون مشکل داشتید رو بیان کنید، بلکه بتونیم فرآیند ثبت نام رو به شکل مناسب تری تغییر بدیم.