قبل از وارد شدن به بحث یادگیری تخصصی، لازمه که یک سری چیزها رو در مورد CSS و HTML بیشتر بدونیم و تفاوتشون رو بررسی کنیم.
سرفصل‌های پست
آیا CSS زبان برنامه‌نویسی است؟
قبل از پاسخ دادن به این پرسش، باید بدونیم منظور از زبان برنامه‌نویسی چیه؟
ساده بگیم: زبان برنامه‌نویسی، زبانی هست که در اون از شرطها، حلقه ها و اینطور قوانینی استفاده میشه. اما در CSS و HTML، این قوانین رو نداریم. در واقع HTML یک زبان نشانه گذاری و CSS، یک زبان شیوه نامه هست.
زبان نشانه گذاری یا markup language، زبانی هست که بر اساس یک سری از قواعد، وظیفه چینش درست متن و در کل، محتوا رو برعهده می‌گیره و تا حد ابتدایی‌ای، می‌تونه اون هارو ویرایش کنه. البته قبلا درباره اچ تی ام ال چیست صحبت کردیم.
زبان شیوه نامه (استایل دهی) یا style sheet language، زبانی هست که نحوه نمایش متن و محتوای تولید شده توسط زبان نشانه گذاری رو برعهده داره.
حالا با علم به این چند خط از اطلاعات، به سوال اصلی این مقاله بپردازیم:
فرق HTML و CSS چیست؟
در جلسه اول با عنوان CSS چیست توضیح دادیم که CSS وب سایتی که توسط HTML طراحی شده رو استایل میده و نحوه نمایشش رو مشخص میکنه! آیا CSS زبانی جداگونه از HTML هست؟
پاسح منفیه. بیاید به طوطی‌ای که در جلسه اول با کمک اون، مفهوم HTML و CSS رو درک کردیم رو بار دیگه ملاقات کنیم!
اشتباهی که اکثر هنرجوهای عزیز در اول کار میکنن، اینه که ممکنه فکر کنن پیج های بدون استایل و زشت با HTML طراحی میشن، و پیج های زیبا با CSS !!!
درحالی که HTML، یک همراه همیشگی برای CSS محسوب میشه.
- HTML، اسکلت، گوشت و پوست طوطی ما رو تشکیل میده!
- CSS، پرها و جذابیت این طوطی رو بر عهده داره!
- و زبان های دیگه مثل جاوااسکریپت، بال زدن و صحبت کردن ایشون رو برعهده دارن!
بنابراین این دو زبان، یعنی HTML و CSS، در کنار هم، صفحه استاتیک یک وب سایت رو طراحی میکنن.
حالا چطوری باهم مرتبط میشن؟
فایل CSS، فایل HTML
همونطور که در آموزش HTML، یاد گرفتین، کد های HTML با پسوند html و به فرم زیر ذخیره میشن:
file.html
کد های CSS هم به همین فرم و در فایل جداگونه ای با پسوند css ذخیره میشن:
file.css
ما توسط یک سری کدها در فایل HTML خودمون، میتونیم این دو فایل رو بهم مرتبط کنیم و باعث بشیم که روی هم اثر بزارن. این قوانین رو در فصل سوم به صورت کامل باهم یاد می‌گیریم.
جمع بندی
در این مقاله یک مقدار کلی تر به HTML و CSS نگاه کردیم و تفاوت‌های موجود بین این زبان‌ها را بررسی کردیم.
اگه نکته، پیشنهاد و انتقادی در رابطه با آموزش‌ها دارین، خیلی خیلی خوشحال می‌شیم که اون رو در بخش دیدگاه‌های پایگاه دانش میزفا ارسال کنین.
مدیر محتوا: علی اسمعیلی
سئوی محتوا: پوریا آریافر
12 پاسخ
مثال طوطی خیلی جالب و قشنگ بود
ممنونم
خواهش میکنیم علی اکبر😃 خوشحالیم که برات کاربردی بوده
اینجا از لحاظ کارکرد توضیح دادین که css و html چه کاری میکنن و چه کاربردی دارن ولی کاش توضیح میدادین که کد های این دو تا از لحاظ ساختاری چه تفاوتی دارن،مثلا یکیشون تگ های زوج یا فرد داره یا با حروف و روش خاصی کد نویسی میشه،در کل این توضیح برای حرفه ای ها یا نیمه حرفه ای ها بود،ما مبتدی ها همچنان بی جواب موندیم
میثم عزیز از نظر ساختاری اصلا قابل مقایسه نیستن چون همه چیزشون فرق داره.
شما اگر آموزش html و بعد آموزش css به ترتیب بری متوجه میشی
با این حال من یک ویس داخل مقاله درج کردم و بیشترتوضیح دادم
واقعا مبحث طوطی رو خیلی خوب گفتی ولی من به دنبال تفاوت سایت وورد پرسی و html ای هستم و می خواستم توضیحات کاملی در باره این سوال داشته باشم
سلام علی ، خب تفاوت اینا ربطی به فرق HTML و CSS نداره.
اینا مربوط میشن به وب سایت پویا و استاتیک که وردپرس یک وب سایت پویا هست و HTML یک کد استاتیک.
در باره وبسایت پویا و استاتیک هم هر کدوم یه خط توضیح بدی ممنون می شم
سلام دوباره علی جان
وب سایت ایستا یا استاتیک : به وب سایت های با محتوایی ثابت میگن و اگه کاربران در زمان های مختلف وارد وب سایت بشن محتوای متفاوتی رو نمیبینن. ممکن هم هست که تغییری داخل صفحات ایجاد کنن که بازم اونا ثابته ولی خب مثلا صفحات اگر هی به مرور زمان تغییر کنند، صفحات به پویا تغییر میکنند. شاید فکر کنی مثلا صفحه مقالات توی وردپرس محتوای ثابتی داشته باشند ولی همیشه این رو در نظر بگیر که حتی همین بخش نظراتی که وجود داره باعث میشه صفحه به مرور زمان هی تغییر کنه.
وب سایت های پویا : به وب سایت های با صفحات هوشمند میگن که به مرور زمان صفحاتش تغییر میکنه. مثلا صفحه اصلی وب سایت میزفا وقتی ما مقاله ای میزاریم اون مقاله داخل صفحه اصلی به صورت هوشمند نمایش داده میشه و این به این معنیه که وب سایت میزفا یک وب سایت پویا هست. یک مثال دیگه هم داخل همون بخش ایستا زدم که داخل بخش مقالات هم ما این پویا بودنه رو میتونیم حس کنیم.
امیدوارم به جوابت رسیده باشی ، موفق باشی.
عالییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییییی
عالی
بود 🙂
سوال بود برام که اقا این چه فرقی دارند یه سایت دیگه خوندم ولی نفهمیدم
توضیح شما راحت مطلب را برام باز کرد و
درک بهتر تو ذهن تا ابد می‌مونه . سایتتون را دنبال خواهم کرد 🙂
سلام ، باعث افتخاره برامون و خوشحالیم که این مقاله بهتون کمک کرده. موفق باشید.
عالی توضیح دادین👏👏👏
سلام، خوشحالیم از اینکه براتون مفید بوده 🙂