HTML و CSS

آموزش مقدماتی زبان CSS و HTML – قسمت اول

سلام

ابتدا قبل از اینکه این پست این رو بخونید بهتره برید در مورد خود کلمه و طراحی در مورد CSS و HTML بخونید که در پست قبلی ما وجود داره.

بعد از توضیحاتی در در مورد بحث کلی CSS و HTML در پست قبل خواندید در این مطلب چگونگی استفاده از این دو زبان ارائه میشود.

ابتدا در این زبان هم مانند زبان #C از نرم افزار Microsoft Visual Studio استفاده میکنیم.(قابل توجه بگیم که نسخه این برنامه زیاد اهمییت ندارد ولی ما از نسخه ۲۰۱۰ این برنامه استفاده میکنیم و پیش فرض خودمون قرار میدیم. )

ابتدا وقتی که برنامه را نصب کردید برنامه را باز کنید گزینه New Project را انتخاب کنید از پنجره ی جدیدی که باز میشود در سمت چپ زبان Visual #C رو انتخاب کنید اگر میخواهید در مورد Windows یاد بگیرید بهتره که سریعا برید به پست های دیگه ما مراجعه کنید در غیراینصورت گزینه Web را انتخاب کنید . سپس گزینه ASP.net Windows Form Application را انتخاب رو انتخاب کنید و سپس اسم پروژه ی مورد نظر و ادرس خودتون رو انتخاب کنید بعد از ورود به پروژه ی موردنظر بالاخره باید یه جایی وجود داشته باشه برای نوشتن کد های موردنظر,اینجا هست که بحث HTML وارد برنامه نویسی میشه .پس در سمت راست برنامه در سر برگ Solution Explorer رو نام پروژه ی خود کلیک راست کرده گزینه ی Add و سپس New Item را انتخاب کنید. از سربرگ جدیدی که باز شده آیتم مورد نظرمون رو انتخاب میکنیم که در این موضوع ما باید HTML Page با پسوند htm انتخاب کنیم بهتره که برای هر صفحه HTML خودتون اسم خاصی بزارید در اینصورت کارتون از یه نظم خاصی برخوردار میشه و گذشته از اینا به عنوان یک برنامه نویس خوب و حرفه ای شناخته میشید.

در مورد کدنویسی باید توجه داشت که تمامی کد ها باید و فقط باید در تگ بدنه یا body نوشته بشه در مورد اینکه در تگ html باید چی نوشت و چیکار کرد هنوز خیلی زوده که بدونید . و همچین باید بدونید بدونید که برای باز و بستن تگ کافیه نوع تگ را در علامت بزرگتر و کوچکتر در وسط ان ها بنویسید و برای بستن ان در ابتدای ان علامت اسلش یا ( / ) استفاده میکنیم به عنوان مثال برای نوشتن یک تگ div به این صورت کار میکنیم :

<div>متن مورد نظر</div>

باید بگم که در این جلسه نمیخواستم کد نویسی رو بگم ولی برای اینکه ذوق شما رو برافکنم یک کد نویسی بسیار ساده به شما میگم. مثلا برای نوشتن Hello World نیاز به کار سختی نیست ابتدا به صورتی که در بالا توضیح دادم یک تگ div تعریف میکنید و کلمه Hello World رو تایپ میکنید سپس برای گرفتن خروجی از کد خود روی صفحه کلیک راست کرده و گزینه View In Browser رو انتخاب میکنید و برنامه با مرورگر پیش فرض رایانه شما باز میشه .
کد نوشته شده باید به این صورت باشه

div>Hello World</div>

حالا نکته بعد اگر شما بخواهید دو تگ div تعریف کنید میبیند که وقتی که خروجی را میگیرید دو کلمه در یک خط چاپ شده جتی اگر دو تگ را در دو خط بنویسید حالا قبل از اینکه از ترفند بردن کلمه به خط بعد رو یادتون بدم بهتره که برید و یک امتحان بکنید و ببینید و منظور منو به طور کامل درک کنید . حالا برای اینکه این ترفند رو یاد بگیرید باید با یک تگ دیگه اشنا بشید به اسم <br/> یا همون مخفف break . همونطور که دیدید تگ break تگ بستن نداره و فقط یک تگ باز داره . حالا وقتی که میخواهید دو کلمه را از هم جدا کنید و در دو خط جداگانه چاپ کنید لازمه که این تگ یا تگ break رو بین این دو خط قرار بدید. در واقع کد بدست امده به این صورته :

<div>Hello World</div>
<br/>
<div>Hello World</div>

امیدوارم که از مطلب من خوشتون اومده باشه حتما نظرات خودتون در بخش نظرات درج کنید شک نکنید که نظرات شما بسیار برای ارزشمند هست . تا جلسات بعد و اموزش ها و مطالب بعد …
نویسنده : AminFT

گروه اموزش برنامه نویسی پنگوئن pangoan.net

2 دیدگاه در “آموزش مقدماتی زبان CSS و HTML – قسمت اول

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *