۰ emad ta
فصل css۳ خلاصه مطالب جلسه دوازدهم - شبه عناصر ( seudo elements )
جامعه Html & CSS ایجاد شده در ۱۸ مرداد ۱۳۹۹

سلام دوستان خلاصه مطالبی که استاد توی این جلسه گفتن رو قرار دادم اگه مطلب اضافه‌تری رو دارین که بنده جا انداختم

لطفا اضافه کنید

 

شبه عناصر ( seudo elements ) شبه تگ ها 

 

 1- Selection ::  موقعی که میایم و انتخاب یا سلکت میکنیم مورد استفاده قرار میگیرد و مثلا میتوانیم رنگ سلکت رو تغیر بدهیم که ما میتوانیم به همه عناصر و یا به یک تگ خاص بیایم و بدهیم 

::Selection {
color: green
}
or
.selector ::Selection {
color: green
}

 

2- frist-line ::  میاد و تغیرات رو فقط برای خط اول ما اعمال میکند و برای بقیه خط‌ها کاری رو انجام نمیدهد و روی بعضی از عناصر اعمال نمی‌شود مثلا روی span اعمال نمیشود که به طور کلی می‌توان گفت تگ هایی که به صورت بلاکی نیستند و inline هستند این سودو المنت روشون اعمال نمی‌شود 

موقعی که ما از این سودو المنت استفاده میکنیم مجاز هستیم که پراپرتی‌های زیر رو براش استفاده بکنیم 

  dfont Properties & color Propertise

background Propertise & word-spacing & letter Spacing & text-decotation & vertical-align & text-transform &line-height

 

3- frist-letter :: میاد و برای اولین کلمه برامون اعمال می‌کند 

 

4- after   &  :: before ::

نکته » استفاده ی before  و after جایی هست که ما نمیخواهیم یک المان یک عنصر روی صفحه جدیدمون داشته باشیم  ولی میخاهیم با css به اون عنصر یک محتوایی رو اضافه بکنیم مثلا میخواهیم در داخل تگ p امان بیایم و یک تصویر قرار بدهیم که برای این کار نیایم و یک تگ تصویر داخل این تگ قرار دهیم بلکه با before و after بیایم و این تغیرات رو انجام بدهیم و  before  after قبل و بعد از اون تگ قرار نمیگیرند بلکه قبل و بعد محتوای اون تگ میان و قرار میگیرن

 

4- before :: زمانی که ما از این سودو المت استفاده میکنیم در داخل آن باید حتما از پراپرتی contentاستفاده بکنیم که یا مقدار خالی میدهیم یا هم میایم و یک url به آن میدهیم ویا از مقادیر دیگه اون استفاده میکنیم 

 

نکته » ما با استفاده از unicode می‌توانیم بیایم و از آیکون‌ها استفاده بکنیم  مثلا فونت اسوم که وقتی اون رو به پروژه امون اضافه بکنیم می‌توانیم  بیایم و با استفاده از یونیکد‌ها بیایم و ازش استفاده بکنیم

 

معرفی پراپرتی opacity  که برای وضوح هست که مقدار صفر در ان یعنی محو کامل و مقدار یک در آن یعنی وضوح کامل تصویر  و مقدار‌های بین صفر و یک رو میگیرد همچنین rgba برای رنگ‌ها که a آخری برای میزان شفافیت رنگ مورد استفاده قرار میگیرد