در توسینسو تدریس کنید

و

با دانش خود درآمد کسب کنید

آموزش HTML گام به گام قسمت 13 : بلاک و کلاس ها

تمام تگ هایی که در اچ تی ام ال وجود دارد، می توانند به صورت مستقل یکسری استایل ها و دسترسی ها را داشته باشند، به عنوان مثال وقتی متنی درون تگ p قرار می گیرد خیلی راحت می توان در سی اس اس به آن استایل داد. اما گاهی اوقات متنی یا شی می تواند داخل یک بلاک باشد که خودمان آن را درست کرده ایم. همچنین می توانید با این کار چندین تگ را با هم در یک بلاک قرار دهیم. برای اینکار می توانید از تگ div استفاده کنید.برای دسترسی به یک تگ Div می توانید از کلاس و آی دی استفاده کرد. به مثال زیر توجه کنید!

<div class="city">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div> 

همانطور که می بینید بلاکی ساخته ایم که خود شامل دو تگ h2,p می باشد. برای دسترسی به این div یک کلاس با نام city ساخته ایم که در حین استفاده از سی اس اس می توانید به آن دسترسی داشته باشید. اگر از class استفاده شود در سی اس اس باید اینگونه عمل کنید:

.city
{
background-color:black;
color:white;
padding:20px;
}

اما اگر بجای class از id استفاده کنید باید اینگونه عمل کنید:

#city
{
background-color:black;
color:white;
padding:20px;
}

بلاک های خطی: اگر بخواهید در یک خط متن به یک کلمه خاص دسترسی داشته باشید استفاده از div خیلی منطقی نیست. در اینگونه مواقع از span استفاده می شود. برای مثال:

<h1>My <span style="color:red">Important</span> Heading</h1>

در این کد کلمه Important به رنگ قرمز درآمده است.

نویسنده : ارسطو عباسی

منبع : جزیره طراحی و توسعه وب وب سایت توسینسو

هرگونه نشر و کپی برداری بدون ذکر منبع و نام نویسنده دارای اشکال اخلاقی می باشد

#آموزش_قدم_به_قدم_html #آموزش_تگ_ها_در_html #آموزش_html #آمورش_html #بلاک_html #آموزش_گام_به_گام_html #استفاده_از_تگ_های_html #کلاس_html
عنوان
1 آموزش HTML گام به گام قسمت 1 : معرفی و آشنایی کلی رایگان
2 آموزش HTML گام به گام قسمت 2 : دستورات مقدماتی و معرفی ساختار رایگان
3 آموزش HTML گام به گام قسمت 3 : صفحات یا Attributes و نکات مربوطه رایگان
4 آموزش HTML گام به گام قسمت 4 : عنوان بندی و تگ های جدید رایگان
5 آموزش HTML گام به گام قسمت 5 : استایل و فرمت متن ها رایگان
6 آموزش HTML گام به گام قسمت 6 : نقل قول و درج توضیحات رایگان
7 آموزش HTML گام به گام قسمت 7 : استفاده از رنگ رایگان
8 آموزش HTML گام به گام قسمت 8 : CSS چیست و مقدمات آن رایگان
9 آموزش HTML گام به گام قسمت 9 : لینک ها رایگان
10 آموزش HTML گام به گام قسمت 10 : تصاویر رایگان
11 آموزش HTML گام به گام قسمت 11 : جداول رایگان
12 آموزش HTML گام به گام قسمت 12 : لیست ها رایگان
13 آموزش HTML گام به گام قسمت 13 : بلاک و کلاس ها رایگان
14 آموزش HTML گام به گام قسمت 14 : قاب بندی رایگان
15 آموزش HTML گام به گام قسمت 15 : تگ عنوان یا Head رایگان
16 آموزش HTML گام به گام قسمت 16 : چند قانون ساده رایگان
17 آموزش HTML گام به گام قسمت 18 : فرم ها رایگان
18 آموزش HTML گام به گام قسمت 19 : کنترل ها و اجزای فرم رایگان
19 آموزش HTML گام به گام قسمت 20 : انواع ورودی رایگان
20 آموزش HTML گام به گام قسمت 21 : خاصیت های تگ input رایگان
21 آموزش HTML گام به گام قسمت 22 : چندرسانه/ویدیو و صدا رایگان
22 آموزش HTML گام به گام قسمت 23 : مدیریت بهتر لایه های وب رایگان
زمان و قیمت کل 0″ 0
0 نظر

هیچ نظری ارسال نشده است! اولین نظر برای این مطلب را شما ارسال کنید...

نظر شما
برای ارسال نظر باید وارد شوید.
از سرتاسر توسینسو
تنظیمات حریم خصوصی
تائید صرفنظر
×

تو می تونی بهترین نتیجه رو تضمینی با بهترین های ایران بدست بیاری ، پس مقایسه کن و بعد خرید کن : فقط توی جشنواره تابستانه می تونی امروز ارزونتر از فردا خرید کنی ....