د CSS3 استثناء په اړه زده کړه

ستاسو د شالیدونو شفافیت جوړول

یو هغه شیان چې تاسو په اسانۍ سره په چاپ ډیزاین کې کولی شئ مګر په ویب کې نه په انځور یا رنګه پس منظر کې متن اضافه کیږي، او د دې انځور روڼتیا بدل کړئ ترڅو متن په پس منظر کې بدل شي. مګر په CSS3 کې ملکیت شتون لري چې تاسو به تاسو ته اجازه درکړي چې د خپل عناصرو افشا بدل کړي ترڅو چې دوی لرې او بهر شي: ناامني.

د توقیف ملکيت څنګه کارول کیږي

د تمرکز ملکیت له 0.0 څخه 1.0 څخه شفافیت مقدار ارزښت لري.

0.0 100٪ شفاف دی- د دې عنصر لاندې به هیڅ ډول شیان په بشپړه توګه نه ښودل کیږي. 1.0٪ 100 ناپاک دی - د عنصر لاندې لاندی هیڅ شی نه شي ښودلی.

نو یو عنصر د 50٪ شفافیت ټاکلو لپاره، تاسو به ولیکئ:

ناڅاپي: 0.5؛

په عمل کې د ناڅاپي ځینې مثالونه وګورئ

په زړو براؤزرونو کې ازموینې ته اړتیا لرئ

نه IE 6 او نه هم د CSS3 توکميزې ملکیت ملاتړ کوي. مګر تاسو له قسمت څخه نه یاست. پرځای یې، IE د مائیکروسافټ - یوازې د ملکیت الفا فلټر مالتړ کوي. په IE کې د الفا فلټرونه د 0 (بشپړ شفافیت) څخه تر 100 پورې بشپړ ارزښتونه (په بشپړ ډول غیر متوقع). نو، تاسو په IE کې خپل شفافیت ترلاسه کولو لپاره، تاسو باید خپل ناڅاپي 100 ته ضرب کړئ او ستاسو شالونو ته الفا فلټر اضافه کړئ:

فلټر: الفا (استعداد = 50)؛

په ال عمل کې الفا فلټر وګورئ (یواځې IE)

او د لټونر انفسکس کاروئ

تاسو باید د MOS- او - مخکی فیلیفس څخه کار واخلئ تر څو د موزیلا او ویبکټ ټیکټرونو پخوانی نسخه دا هم مالتړ وکړي:

د وړتیا لوړتیا: 0.5؛
-موز - استحکام: 0.5؛
ناڅاپي: 0.5؛

تل د بریښناليک مخففونه ولیکئ، او د درست CSS3 ملکیت وروستی.

د براؤزر مخففونه په زاړه موزیلا او ویبکټ براؤزرونو کې معاینه کړئ.

تاسو کولی شئ انځورونه شفافیت جوړ کړئ

پخپله په انځور کې ناڅاپه ترتیب کړئ او دا به په پس منظر کې له منځه یوسي. دا د پس منظر انځورونو لپاره ګټور دي.

او که تاسو په لمر ټګۍ کې اضافه کړئ تاسو کولی شئ د عکس د افادیت بدلولو سره د هورور اثرات رامنځته کړئ.

a: hover img
فلټر: الفا (استعداد = 50)
فلټر: پروګیټ: DXImageTransform.Microsoft.Alpha (opacity = 50)
-موز - استحکام: 0.5؛
د وړتیا لوړتیا: 0.5؛
ناڅاپي: 0.5؛
}

دا HTML باندې اغیز کوي:

پورته شاليدونه او HTML په عمل کې معاينه کړئ.

ستاسو په انځورونو متن ولیکئ

د دوامداره کولو سره، تاسو کولی شئ په یو انځور کې متن ولرئ او انځور ولري چې دا له منځه وړي چې دا متن کوم دی.

دا تخنیک خورا لږ ستونزمن دی، ځکه چې تاسو په ساده ډول عکس نه پریږدی، ځکه چې دا به ټول عکس ختم کړي. او تاسو نشی کولی د متن بکس ودرول شی ، ځکه متن به هم هلته واخیستل شی.

1. لومړی تاسو یو کانټینر جوړ کړئ DIV او خپل عکس دننه دننه کړئ:

   
   

2. انځور د خالي خالي ډیو سره تعقیب کړئ هغه څه دي چې تاسو شفاف یاست.

   
   
   

3. ستاسو په HTML کې تاسو اضافه شي وروستی شی دا ده چې ستاسو په متن کې یې د DIV دی:

   
   
   
   دا زما سپی دی. ایا هغه ښه نه ده

4. تاسو دا د سی ایس ایس پوټینګ سره ډک کړئ، ترڅو د انځور پورته متن پورته کړئ. ما خپل متن په ښي خوا کې واچاوه، مګر تاسو کولی شئ دا ښي لور ته بدلون ورکړئ. حق ته حقونه: 0؛ .

   #image {
   موقف: نسبتا؛
   سورې: 170px؛
   لوړ والی: 128px؛
   حاصله: 0؛
   }
   #text {
   موقف: مطلق؛
   پورته: 0؛
   پریښودل: 0؛
   سورې: 60px؛
   اندازه: 118px؛
   شاليد: #fff؛
   ګنډل: 5px؛
   }
   #text {
   فلټر: الفا (استعداد = 70)؛
   فلټر: پروګیټ: DXImageTransform.Microsoft.Alpha (opacity = 70)؛
   -Moz-opacity: 0.70؛
   دوامداره: 0.7؛
   }
   #words {
   موقف: مطلق؛
   پورته: 0؛
   پریښودل: 0؛
   سورې: 60px؛
   اندازه: 118px؛
   پس منظر: شفاف؛
   ګنډل: 5px؛
   }

وګورئ چې دا څنګه ښکاري