কম্পিউটার টিউটোরিয়াল

CSS দিয়ে ওয়ার্ড স্পেসিং (Word Spacing) কাজ করা

CSS word-spacing প্রোপার্টি একটি এলিমেন্টের শব্দগুলোর মাঝপথের স্পেস নির্দিষ্ট করতে ব্যবহৃত হয়।

সিনট্যাক্স

CSS word-spacing প্রোপার্টির সিনট্যাক্স নিচের মতো:

Selector {    word-spacing: /*value*/ }

উদাহরণ

নিচের উদাহরণগুলো CSS word-spacing প্রোপার্টি ব্যাখ্যা করে:

<!DOCTYPE html> <html> <head> <style> div {    display: flex;    float: left;    padding: 10px;    background-color: salmon; } div > div {    word-spacing: 30px;    width: 340px;    height: 140px;    border-radius: 5%;    box-shadow: inset 0 0 15px blueviolet; } </style> </head> <body> <div> <div> Magento is an open source E-commerce software, created by Varien Inc., which is useful for online business. It has a flexible modular architecture and is scalable with many control options that is helpful for users.</div> </div> </body> </html>

আউটপুট

এটি নিচের আউটপুট দেয়:

CSS দিয়ে ওয়ার্ড স্পেসিং (Word Spacing) কাজ করা

আরেকটি উদাহরণ

<!DOCTYPE html> <html> <head> <style> q {    display: flex;    padding: 10px;    word-spacing: 6em;    background-color: orange;    font-size: 1.2em; } </style> </head> <body> <h2>What is Java?</h2> According to Java's official documentation, <hr> <q cite="https://www.java.com/en/download/faq/whatis_java.xml">Java is a programming language and computing platform first released by Sun Microsystems in 1995.</q> </body> </html>

আউটপুট

এটি নিচের আউটপুট দেয়:

CSS দিয়ে ওয়ার্ড স্পেসিং (Word Spacing) কাজ করা

  1. ফ্লেক্সবক্স দিয়ে অ্যাডভান্সড CSS লেআউট

  2. CSS দিয়ে ইউজার রেটিং স্কোরকার্ড তৈরি করার পদ্ধতি

  3. CSS word-spacing প্রোপার্টি ব্যবহার করে শব্দের মাঝপথে স্পেস নিয়ন্ত্রণ করা

  4. শুধু CSS ব্যবহার করে স্মুথ স্ক্রোলিং বাস্তবায়ন করা