প্রদর্শন পদ্ধতি (display)
সি এস এস এ ডিসপ্লে প্রোপার্টি প্রকাশ করে কোন একটা উপাদান কিভাবে প্রদর্শিত হবে।ডিসপ্লে প্রোপার্টির বেশ কিছু value হতে পারে, এদের মধ্যে সবচেয়ে বেশি ব্যাবহৃত হয়,
- ডিসপ্লে নান -(display:none)
- ডিসপ্লে ইন লাইন -(display:inline)
- ডিসপ্লে ব্লক – (display:block)
ডিসপ্লে নান -(display:none)
কোন বিশেষ উপদানকে প্রদর্শন না করার জন্য ডিসপ্লে নান ব্যবহার করা হয়, এজন্য Declaration করতে হয় display:none;।
অনুশীলন প্রজেক্ট
<html>
<head>
<title> www.tutohost.com</title>
<style>
body{background: #FFC}
#none{width:265px;
background:#F30;
padding:10px;}
#none:hover{display:none;}
</style>
</head>
<body >
<h2>www.tutohost.com</h2>
<div id="none">
<h1>Please Touch Me.</h1></div>
<h2>We are bangladeshi Hostgator hosting provider.</h2>
</body>
</html>
একটা নোটপ্যাড open করে উপরের code টুকু লিখে file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করে index.html ফাইলটি Mozilla Firefox দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।
কোডিং বিশ্লেষণ:
উপরের উদাহরণটিতে Please Touch Me. লেখাটির উপরে মাউস পয়েন্টার নিয়ে গেলে এটি অদৃশ্য হয়ে যায় এজন্য কোডিং এ লেখা হয়েছে #none:hover{display:none;} । অর্থাৎ none নামের div টির মাউস হোবার display:none ।
তিনি ইলেকট্রিক্যাল ইঞ্জিনিয়ারিং এ লেখাপড়া করছেন। টিউটোরিয়ালবিডি ও বিজ্ঞানপ্রযুক্তি ব্লগে তিনি ইলেক্ট্রনিক্স সহ বিভিন্ন টেকনোলজি বিষয়ে লিখে থাকেন। বর্তমানে তিনি লেখাপড়ার পাশাপাশি টিউটোহোস্টে কর্মরত আছেন।
কপি রাইট © ২০১১থেকে যতদিন চলবে সর্বস্বত্ত্ব সংরক্ষিত