Awesome! টিউনস
সকল Awesome! টিউনস

সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার

1,256 দেখা 0 টিউমেন্টস জোসস
টিউন বিভাগ সিএসএস
প্রকাশিত
Level 0

162 টিউনস 69 টিউমেন্টস 1 ফলোয়ার

আসসালামু আলাইকুম। সবাইকে সিএসএস ট্রিক্স এ স্বাগতম। গত টিউটোরিয়ালে দেখিয়েছিলাম সিএসএস দিয়ে লেখায় ব্লার ইফেক্ট যুক্ত করুন। এবার দেখাবো কিভাবে সিএসএস৩ দিয়ে রাউন্ড এবং ইলিফটিকাল কর্নারের ব্যবহার দিয়ে সহজে রাউন্ড কর্নার বানানো যায়।তবে সেক্ষেত্রে প্রত্যেক ব্রাউজারের জন্য আলাদা কোড লিখে দিতে হয়।  আজকে যে কোডগুলো দিব সেগুলো শুধু ক্রোমে কাজ করবে ।

তো চলুন দেখি কোডগুলো-

স্ট্যান্ডার্ড রাউন্ডের জন্য কোড হবে-

standard

-webkit-border-radius: 10px;

প্রত্যেকের আলাদা আলাদা কর্নারের জন্য কোড হবে-

individual

-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-right-radius: 30px;
-webkit-border-bottom-left-radius: 0;

শুধু মাত্র ডান পাশের ইলিফটিকাল কর্নারের জন্য কোড হবে-

right
-webkit-border-top-right-radius: 50px 30px;
-webkit-border-bottom-right-radius: 50px 30px;
শুধু মাত্র বাম পাশের ইলিফটিকাল কর্নারের জন্য কোড হবে-

left
-webkit-border-top-left-radius: 50px 30px;
-webkit-border-bottom-left-radius: 50px 30px;
সবপাশে ইলিফটিকাল কর্নারের জন্য কোড হবে-

all ele
-webkit-border-radius: 36px 12px;

_________________________________________________________________________________________________________

নোটপ্যাডে  নিচে থেকে লিখতে হবে-

<html><head><style type="text/css">

.shape {
background: #fe4902;
width: 200px;
height: 100px;
line-height: 100px;
text-align: center;
margin: 0 auto;

/* এখানে যে শেপ দিতে চান সে কোড লিখুন */

}

</style></head>
<body>

<div id="shape">
</div>

</body>

এই কোডগুলো নোটপ্যাডে লিখে উপরের যে কোন স্টাইলের কোডগুলো নিয়ে <style></style> এর মাঝে বসিয়ে round.html দিয়ে সেভ করুন। ব্রাউজারে ওপেন করে দেখুন। বুঝতে অসুবিধা হলে কমেন্টে জানান । ধন্যবাদ।

পোস্ট লিখেছেন টিউটোহোস্টের সাপোর্ট বিভাগে কর্তব্যরত নিলুফার ইয়াসমিন

পূর্বে প্রকাশিত টিউটোরিয়ালবিডি ব্লগে

Level 0

আমি টিউটোহোস্ট। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 11 বছর 11 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 162 টি টিউন ও 69 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 1 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।

টিউটোহোস্ট বাংলাদেশের একটি জনপ্রিয় ওয়েব হোস্টিং সেবাদানকারী প্রতিষ্ঠান। যুক্তরাস্ট্র এবং যুক্তরাজ্য ভিত্তিক দ্রুতগতির বেশ কিছু ওয়েব সারভারে গুরুত্বপূর্ণ তথ্যগুলো নিরাপদে সংরক্ষণ করা হয়। আমরা এদেশে ২৪ ঘন্টা এবং বছরে ৩৬৫ দিন অনলাইন এবং ফোন সাপোর্টের ব্যবস্থা রেখেছি। বাংলেদশসহ অনেক দেশের জনপ্রিয় ওয়েবসাইট আমাদের সারভার ব্যবহার করছে।

টিউনস

আরও টিউনস

টিউনারের আরও টিউনস

টিউমেন্টস