সিএসএস-এর কয়েকটি দুর্দান্ত / সেরা / খারাপ গালাগালি কী?
উদাহরণস্বরূপ, এই আকারগুলি , বা পিক্সেল আর্ট তৈরি করতে একাধিক বক্স-ছায়া ব্যবহার করা হচ্ছে।
জনপ্রিয়তা-প্রতিযোগিতা 16/04/14 এ শেষ হবে।
সিএসএস-এর কয়েকটি দুর্দান্ত / সেরা / খারাপ গালাগালি কী?
উদাহরণস্বরূপ, এই আকারগুলি , বা পিক্সেল আর্ট তৈরি করতে একাধিক বক্স-ছায়া ব্যবহার করা হচ্ছে।
জনপ্রিয়তা-প্রতিযোগিতা 16/04/14 এ শেষ হবে।
উত্তর:
কিছু ডিউড কোনও ছবি খাঁটি সিএসএসে রূপান্তর করার জন্য একটি সরঞ্জাম তৈরি করেছে। এটি সিএসএসের মূল উদ্দেশ্যকে ছাড়িয়ে যায়।
এখানে একটি উদাহরণ (বিখ্যাত মোনালিসা): http://codepen.io/jaysalvat/pen/HaqBf
এবং এখানে সরঞ্জামটি রয়েছে: https://github.com/jaysalvat/image2css
আমি অগত্যা এটি অপব্যবহার বলব না, তবে আপনি সম্পূর্ণ আলাদা চিত্র দেখানোর জন্য IMG
প্রদত্ত একটি প্রতিস্থাপন করতে CSS ব্যবহার করতে পারেন SRC
।
@media print
{
IMG
{
padding: 150px 200px 0px 0px;
background: url('lady.jpg');
background-size:auto;
width:0px; height: 0px;
}
}
দেখুন: /programming/2182716/how-can-we-specify-src-attribute-of-img-tag-in-css
@media
কোনও ওয়েবপৃষ্ঠা প্রিন্ট করার সময় নির্বাচিতদের সাথে সম্পূর্ণ আলাদা চিত্র প্রদর্শনের জন্য মজাদার হতে পারে । (বিটিডব্লিউতে একই কৌশল করা যেতে পারে PDF
a যে দলিলটি মুদ্রণ করছে এবং যে সমস্ত গুরুতর চেহারাযুক্ত চার্টগুলি সুন্দর মহিলা দ্বারা প্রতিস্থাপন করা হয়েছে তার মুখটি দেখে ভাল লাগল :))
resize:both
ব্যবহারকারী দ্বারা কোনও উপাদানকে পুনরায় আকার দেওয়ার জন্য আপনি যুক্ত করতে পারেন ।
কিছু ব্রাউজারে এটি কেবলমাত্র এর উপর সমর্থিত <textarea>
।
এটি আসল CSS বিষয় নয়, তবে আপনি contenteditable
সম্পত্তি যুক্ত করতে পারেন, সম্পত্তি যুক্ত style="display:block;z-index:99;width:500px;height:500px;resizable:both;"
করতে পারেন এবং আপনার সিএসএস সম্পাদনা করতে পারেন।
উদাহরণস্বরূপ নিম্নলিখিত চিহ্নের টুকরোটি ব্যবহার করুন:
<input type="checkbox" id="check_all" name="check_all" value="1">
<label for="check_all">Check all</label>
আপনি CSS3 সিলেক্টর ব্যবহার display:none
করে <input>
এবং ব্যবহার করতে পারেন, আপনি চেকবক্স / রেডিওবুতনের বিভিন্ন রাজ্য দেখানোর জন্য একটি 'স্প্রাইট' পটভূমি সেট করতে পারেন।
উপাদানগুলির ক্রমটি গুরুত্বপূর্ণ, এবং ইনপুটটিতে সংযুক্তির সাথে for=""
সম্পত্তিটি মিলানো id=""
আরও বেশি গুরুত্বপূর্ণ!
আপনি এখানে কয়েকটি উদাহরণ দেখতে পারেন: http://www.csscheckbox.com/
আমরা সবাই সিএসএস ক্লাস এবং মিডিয়া-প্রশ্নের সাথে কিছু প্রকারের জাভাস্ক্রিপ্ট মিশ্রণটি ব্যবহার করার চেষ্টা করেছি ...
ঠিক আছে, এখানে কয়েকটি ব্রাউজার নির্দিষ্ট নির্বাচক রয়েছে:
doesnotexist:-o-prefocus, #selector {}/*opera only*/
:root {}/*target all css3 browsers*/
:-moz-any(*){}/*mozilla and mozilla based only*/
:-webkit-any(*){}/*webkit only*/
আই আই এর জন্য, আপনার কাছে প্রচুর নির্বাচক রয়েছে। এর বেশি দরকার নেই।
আমি অনুমান করি এটি আপত্তি দ্বারা আপনি কী বোঝাতে চাইছেন তা নির্ভর করে তবে এটি আপনার ব্যবহারকারীদের ব্যাট করতে পারবে:
*:hover{
zoom:99%;
}
(পৃষ্ঠার চারপাশে মাউস হিসাবে সমস্ত কিছু আপনাকে আঘাত করে)
*{
color:transparent;
text-shadow:0 0 5px rgba(0,0,0,0.5);
}
(সমস্ত পাঠ্যকে অস্পষ্ট করে তোলে)
http://jsfiddle.net/simurai/CGmCe/light/
(জাভা এর "দ্য ডুড" হাত বুলাচ্ছে)
style
বৈশিষ্ট্যগুলিতে ইনলাইন ব্যবহার এবং!important
প্রতিটিটিতে যুক্ত করা।