بستن منو
۸۰
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مباحث اولیه برای آشنایی با CSS
مباحث اولیه برای آشنایی با CSS
7
نمایش متن، در CSS
نمایش متن، در CSS
16
ساخت حاشیه (border)، در CSS
ساخت حاشیه (border)، در CSS
4
عکس ها، در CSS
عکس ها، در CSS
7
انتخابگرها (Selector) (انتخاب عنصرهای صفحه)، در CSS
انتخابگرها (Selector) (انتخاب عنصرهای صفحه)، در CSS
9
بچه های (Child) عنصرها، در CSS
بچه های (Child) عنصرها، در CSS
0
اندازه عنصرها، در CSS
اندازه عنصرها، در CSS
1
موقعیت عنصرها، در CSS
موقعیت عنصرها، در CSS
3
تغییر شکل عنصرها، در CSS
تغییر شکل عنصرها، در CSS
4
عدم نمایش عنصرها، در CSS
عدم نمایش عنصرها، در CSS
2
ساخت انیمیشن، در CSS
ساخت انیمیشن، در CSS
6
لینک ها (Link)، در CSS
لینک ها (Link)، در CSS
6
رنگ ها (Color) و تعیین رنگ، در CSS
رنگ ها (Color) و تعیین رنگ، در CSS
2
فهرست ها (لیست ها - List)، در CSS
فهرست ها (لیست ها - List)، در CSS
2
جدول ها (Table)، در CSS
جدول ها (Table)، در CSS
2
فرم ها (Form)، در CSS
فرم ها (Form)، در CSS
2
دکمه ها (Button)، در CSS
دکمه ها (Button)، در CSS
2
صفحه نمایش (Screen)، در CSS
صفحه نمایش (Screen)، در CSS
0
مباحث عمومی، در CSS
مباحث عمومی، در CSS
5

534

نویسنده

علیرضا گلمکانی ( admin )

شماره کلید
دسته کلید - دسته بندی

مشخصه id برای تعیین بخش مورد نظرمان برای اجرای کدهای CSS

با استفاده از مشخصه id ، می توانیم برای یک بخش خاص ، نامی را تعیین کنیم (یک id) و البته این نام باید منحصربفرد باشد . زمانی که بخش مورد نظرمان دارای یک نام منحصربفرد باشد ، آنگاه می توانیم درون کدهای CSS ، نام آن بخش مورد نظرمان را ذکر کنیم و سپس مشخصات دلخواهی را برای آن بخش تعیین کنیم . به مثال زیر توجه کنید :

مثال

<html>
 
<head>
<style type="text/css">
#red_paragraph {
                    color:red;
               }      
</style>
</head>
 
<body>

<p id="red_paragraph">paragraph number 1 .</p>
<p>paragraph number 2 .</p>
<p>paragraph number 3 .</p>

</body>
</html>

همان طور که مشاهده می کنید ، برای تگ p اول که مربوط به پاراگراف اول می باشد ، مشخصه id را برابر red_paragraph تعیین کرده ایم که باعث می شود آن پاراگراف را با id معادل red_paragraph شناسایی کنیم . حالا تنها کاری که باید انجام بدهیم این است که درون کدهای CSS ، به این id ، ارجاع بدهیم . این کار توسط علامت # انجام می شود و پس از نوشتن این علامت ، باید نام id را بنویسیم . سپس باید مشخصاتی را که می خواهیم را درون دو علامت } و { بنویسیم . مشخصه color را برابر red انتخاب کرده ایم که باعث می شود پاراگراف اول به رنگ قرمز نمایش داده شود .

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید

کپی برداری از محتوای سایت کلیدستان، ممنوع بوده و پیگرد قانونی دارد. (تنها استفاده شخصی کاربر، مجاز است) (کپی برداری توسط سایر وب سایت ها = حرام) (بیشتر بدانید)

به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 2 2 0
S
۱۳۹۹/۰۵/۳۱
۱۵:۰۷

پس id , class فرقی با هم ندارند

admin
۱۳۹۹/۰۵/۳۱
۲۳:۰۳

سلام.
id برای مشخص کردن یک بخش منحصربفرد (تنها یک عنصر از صفحه) به کار می رود و برای ارجاع به آن از علامت # استفاده می شود. بنابراین حتما باید نام تعیین شده برای آن، منحصربفرد باشد (برای عنصر دیگری به کار نرفته باشد).
اما class برای مشخص کردن چند بخش (چند عنصر) به کار می رود (البته امکان استفاده در تنها یک عنصر نیز وجود دارد). یعنی وقتی می خواهیم به چند عنصر از صفحه اشاره کنیم، می توانیم یک نام class را برای همه آن عنصرها ذکر کنیم و بعد ویژگی های مورد نظرمان برای آن چند عنصر را برای class تعیین شده ذکر نماییم. برای ارجاع به class ها از علامت نقطه (علامت . ) استفاده می شود.

Flower

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)

جستجو در کلیدستان، توسط گوگل

جستجو در عنوان کلیدها

دسترسی سریع

×

شماره کلید


کلید
×

شماره دسته کلید


دسته کلید
×

جستجو


جستجو

راهنمای مشخصه های CSS

راهنمای مشخصه های CSS بر اساس حرف اول مشخصه :

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

بستن منو
۳۵
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
دسترسی سریع به دسته کلیدها :

CSS Tutorials
مجموعه ویدئوهای آموزشی CSS - مجموعه CSS Tutorials
مجموعه ویدئوهای آموزشی CSS - مجموعه CSS Tutorials
35
بستن منو
۷
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
دسترسی سریع به دسته کلیدها :

Sass & SCSS Tutorial for Beginners
مجموعه ویدئوهای آموزشی Sass و SCSS برای مبتدیان - مجموعه Sass & SCSS Tutorial for Beginners - از thenewboston.com
مجموعه ویدئوهای آموزشی Sass و SCSS برای مبتدیان - مجموعه Sass & SCSS Tutorial for Beginners - از thenewboston.com
7
بستن منو
۴
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
دسترسی سریع به دسته کلیدها :

مباحث اولیه
مباحث اولیه برای آشنایی با LESS
مباحث اولیه برای آشنایی با LESS
4
بستن منو
۱۰۴
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مباحث اولیه برای آشنایی با HTML
مباحث اولیه برای آشنایی با HTML
24
نمایش متن (Text)، در HTML
نمایش متن (Text)، در HTML
16
نمایش عکس (Image)، در HTML
نمایش عکس (Image)، در HTML
6
لینک ها (Link)، در HTML
لینک ها (Link)، در HTML
2
فهرست ها (لیست ها - List)، در HTML
فهرست ها (لیست ها - List)، در HTML
1
جدول ها (Table)، در HTML
جدول ها (Table)، در HTML
7
فرم ها (Form)، در HTML
فرم ها (Form)، در HTML
21
کلاس های (Class) عنصرها، در HTML
کلاس های (Class) عنصرها، در HTML
1
id عنصرها، در HTML
id عنصرها، در HTML
0
چیدمان عنصرها (Element) در کنار هم، در HTML
چیدمان عنصرها (Element) در کنار هم، در HTML
2
تعیین مشخصات کلی صفحه (Page)، در HTML
تعیین مشخصات کلی صفحه (Page)، در HTML
7
ساختار کلی و بخش بندی صفحه (Page)، در HTML
ساختار کلی و بخش بندی صفحه (Page)، در HTML
2
نمایش یا عدم نمایش عنصرها (Element)، در HTML
نمایش یا عدم نمایش عنصرها (Element)، در HTML
1
عناصر گرافیکی، در HTML
عناصر گرافیکی، در HTML
1
رنگ ها (Color) و تعیین رنگ، در HTML
رنگ ها (Color) و تعیین رنگ، در HTML
1
دکمه ها (Button)، در HTML
دکمه ها (Button)، در HTML
2
پخش صدا (Audio)، در HTML
پخش صدا (Audio)، در HTML
1
کار با کیبورد (Keyboard)، در HTML
کار با کیبورد (Keyboard)، در HTML
2
اطلاعات و پردازش اطلاعات، در HTML
اطلاعات و پردازش اطلاعات، در HTML
1
مباحث عمومی، در HTML
مباحث عمومی، در HTML
6
بستن منو
۴۲
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مباحث اولیه برای آشنایی با W3.CSS
مباحث اولیه برای آشنایی با W3.CSS
11
متن ها (Text)، در W3.CSS
متن ها (Text)، در W3.CSS
1
رنگ ها (Color)، در W3.CSS
رنگ ها (Color)، در W3.CSS
6
عکس ها (Image)، در W3.CSS
عکس ها (Image)، در W3.CSS
9
خطوط حاشیه (border)، در W3.CSS
خطوط حاشیه (border)، در W3.CSS
3
حاشیه (Padding و Margin)، در W3.CSS
حاشیه (Padding و Margin)، در W3.CSS
1
کارت ها (Card)، در W3.CSS
کارت ها (Card)، در W3.CSS
1
فونت ها (Font)، در W3.CSS
فونت ها (Font)، در W3.CSS
1
فهرست ها (لیست - List)، در W3.CSS
فهرست ها (لیست - List)، در W3.CSS
4
راهنماها (Tooltip)، در W3.CSS
راهنماها (Tooltip)، در W3.CSS
0
انیمیشن ها (Animation)، در W3.CSS
انیمیشن ها (Animation)، در W3.CSS
5