লাইনের ব্যবধান সেট করুন


145

আমি কীভাবে সিএসএসের সাথে লাইন স্পেসিং সেট করতে পারি, যেমন আমরা এমএস ওয়ার্ডে সেট করতে পারি?

উত্তর:


236

লাইন উচ্চতা চেষ্টা করুন সম্পত্তি ।

উদাহরণস্বরূপ, 12px হরফ আকার এবং নীচে এবং উপরের রেখা থেকে 4px দূরে:

line-height: 20px; /* 4px +12px + 4px */

বা emইউনিট সহ

line-height: 1.7em; /* 1em = 12px in this case. 20/12 == 1.666666  */

10
আমি অনুভব করেছি যে display: block;এই সেটিংসটি কেবলমাত্র অনুচ্ছেদের উপরে এবং নীচে নয়, সর্বত্র কার্যকর হওয়ার প্রয়োজন needed
প্যাট্রিকটি

2
মনে রাখবেন যে আপনি যদি <a> উপাদানটিতে সেট করে থাকেন তবে আপনি '1' বা '100%' এর অধীনে লাইন-উচ্চতার সম্পত্তির মান সেট করতে পারবেন না। আপনি যদি এটি চান, উদাহরণস্বরূপ আপনি আপনার পাঠ্য এবং আপনার <a> এর মধ্যে একটি <p> সেট করতে পারেন।
রাউলচোপি

2
এটি স্প্যান দিয়ে কাজ করে না কারণ @ পেট্রিকটি স্প্যান দ্বারা উল্লিখিত হিসাবে প্রদর্শিত হচ্ছে না: ব্লক
ওয়ালভ

1
@ ওয়ালভ, এটি ধরে নেওয়া যায় না A এছাড়াও যদি আপনাকে এটি স্প্যানে ব্যবহার করতে হয় তবে এটি প্রদর্শন: ব্লকের পরিবর্তে ডিসপ্লে: ইনলাইন-ব্লক ব্যবহার করা পছন্দনীয়।
মারিও সিজার

1
@Userhatisnotसर হিসাবে আপনি একই জাতীয় ঘটনা ঘটতে পারবেন না এমন ব্যবহারকারীদের জাভা অ্যাপলেট বা ওয়েব অ্যাপ্লিকেশন ব্যবহার করতে হবে যা ᴜᴅᴘ সকেটের প্রয়োজন (কারণ the সমর্থন হারিয়েছে এবং সমস্ত ব্রাউজারগুলি তাদের কাস্টম প্লাগ ‑ ইন। ইন সমর্থন প্রত্যাহার করছে) । Ini ক্যাসিনি মিশনে উত্সর্গীকৃত ওয়েব সাইটটিতে তাদের ভিডিওꜱ অনলাইন দেখার জন্য দ্রুত সময়ের প্লাগইন প্রয়োজন requires কেবলমাত্র উল্লেখ না করা ɴᴘᴀᴘɪ প্লাগইনগুলি আপনাকে স্ট্রিমিংয়ে স্টেরিওস্কোপিক প্রদর্শনগুলির মাধ্যমে স্টেরিওস্কোপিক ভিডিও দেখতে দেয়। আমার দেশে দুটি বড় টিভি চ্যানেল সরবরাহকারী এখনও আপগ্রেড না করার পরিকল্পনা সহ সিলভারলাইটের প্রয়োজন।
ব্যবহারকারী 2284570

103

আপনি ইউনিট-কম মানও ব্যবহার করতে পারেন, এটি লাইন সংখ্যা: line-height: 2;দ্বিগুণ ব্যবধানযুক্ত, দেড়টি line-height: 1.5;, ইত্যাদি


এটি প্রেস্টো ভিত্তিক অপেরাতে কাজ করে না। আমার একটা পরিশ্রম দরকার ... প্লিজ! : \
ব্যবহারকারী 2284570

@ ব্যবহারকারীর অবস্থা: আমার মেশিনে কাজ করে। আপনি অন্য উত্তরগুলির কোন চেষ্টা করেছেন?
মাইক দ্য লাইয়ার

মানে সিএসএস উপাদানটি স্বীকৃত, তবে রেন্ডারিং আউটপুটকে প্রভাবিত করে না। 12.16 এবং 12.50 পরীক্ষা করা হয়েছে। অন্যান্য উত্তরটি মূলত একই: তারা লাইন-উচ্চতা উপাদানটি ব্যবহার করতে সমস্ত কথা বলছে!
ব্যবহারকারী 2284570

@ ব্যবহারকারীর কারণ আপনি এটি এটি করেন। আমি এটি ব্রাউজার বাগ বা c সিএসএস নিয়মের সমর্থনের অভাব ধারণা করব imagine সম্ভবত পৃথক প্রশ্ন হিসাবে জিজ্ঞাসা করা উচিত।
মাইক দ্য লাইয়ার

নিশ্চিতভাবেই, এখানে কাজটি জিজ্ঞাসা করা অফ-টপিক ... এটি যেভাবে দেখেছি এটি অন্যান্য ব্রাউজার ব্র্যান্ডগুলিকে প্রভাবিত করে: এটি যখন ডোমটির সাথে সেটিংটি সেট করা থাকে বা যখন সন্তুষ্ট = "সত্য" উপস্থিত থাকে তখন উপস্থিত থাকে।
ব্যবহারকারী 2284570

12

আপনি লাইন-উচ্চতা, <p>ব্লকের মধ্যে ব্যবধানের সাহায্যে সিএসএসে আন্তঃ অনুচ্ছেদের ব্যবধান সেট করতে পারবেন না । পরিবর্তে ইন্ট্রা-অনুচ্ছেদে লাইন ব্যবধান সেট করে, একটি <p>ব্লকের মধ্যে লাইনের মধ্যবর্তী স্থান । অর্থাৎ লাইন-উচ্চতা হ'ল অনুচ্ছেদের মধ্যে শীর্ষস্থানীয় টাইপোগ্রাফারের আন্তঃরেখাটি লাইন-উচ্চতা দ্বারা নিয়ন্ত্রিত হয়।

আমি বর্তমানে সিএসএসে কোনও 0.15 মিমি আন্তঃস্পেসিং উত্পাদন করার কোনও পদ্ধতি সম্পর্কে জানি না <p>, কোনও ফন্টের সম্পত্তিতে ইম বা রেম রূপগুলি ব্যবহার করা হোক না কেন। আমি সন্দেহ করি এটি আরও জটিল ফ্লোট বা অফসেটের সাহায্যে করা যেতে পারে। দুঃখের বিষয় এটি সিএসএসে প্রয়োজনীয়।


7
আন্তঃস্পেসিংয়ের জন্য আপনি কি মার্জিন ব্যবহার করতে পারবেন না <p>?
ফ্লিম

4
কিছু ক্ষেত্রে, margin-topএবং / অথবা margin-bottomএখানে যা পছন্দসই তা কার্যকরভাবে সম্পাদন করতে পারে।
ব্যবহারকারী 1147171

10

আপনি যদি কনডেন্সড লাইনগুলি চান তবে আপনি font-sizeএবং এর জন্য একই মান নির্ধারণ করতে পারেনline-height

আপনার সিএসএস ফাইলে

.condensedlines {              
    font-size:   10pt;
    line-height: 10pt;  /* try also a bit smaller line-height */
}

আপনার এইচটিএমএল ফাইলটিতে

<p class="condensedlines">
bla bla bla bla bla bla <br>
bla bla bla bla bla bla <br>
bla bla bla bla bla bla <br>
</p>

-> jsfiddle.net এ এই স্নিপেট সঙ্গে খেলুন

আপনি line-heightসূক্ষ্ম রেখার ব্যবধান নিয়ন্ত্রণের জন্য বৃদ্ধি করতে পারেন :

.mylinespacing {
    font-size:   10pt;
    line-height: 14pt; /* 14 = 10 + 2 above + 2 below */
}

9

এই সম্পত্তি চেষ্টা করুন

line-height:200%;

অথবা

line-height:17px;

বৃদ্ধি এবং ভলিউম হ্রাস ব্যবহার করুন


@ অ্যাভিডি: এটি প্রেস্টো ভিত্তিক অপেরাতে কাজ করে না। আমার একটা পরিশ্রম দরকার ... প্লিজ! : \
ব্যবহারকারী 2284570


4

line-heightসম্পত্তি চেষ্টা করুন ; লাইন উচ্চতা নির্ধারণ করার বিভিন্ন উপায় রয়েছে


1

হ্যাঁ, প্রত্যেকের বক্তব্যটি line-heightহ'ল জিনিস। আপনি যে কোনও ফন্ট ব্যবহার করছেন, একটি মাঝারি উচ্চতার অক্ষর (যেমন একটি বা ■, উপরের বা নীচের মধ্য দিয়ে যাচ্ছেন না) একই উচ্চতা-দৈর্ঘ্যের সাথে line-height: 0.6যেতে হবে 0.65

<div style="line-height: 0.65; font-family: 'Fira Code', monospace, sans-serif">
aaaaa<br>
aaaaa<br>
aaaaa<br>
aaaaa<br>
aaaaa
</div>
<br>
<br>

<div style="line-height: 0.6; font-family: 'Fira Code', monospace, sans-serif">
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■
</div>
<br>
<br>
<strong>BUT</strong>
<br>
<br>
<div style="line-height: 0.65; font-family: 'Fira Code', monospace, sans-serif">
ddd<br>
ƒƒƒ<br>
ggg
</div>


0

লাইনস্প্যাকিং রিএ্যাক্ট নেটিভ (বা নেটিভ মোবাইল অ্যাপ্লিকেশন) এ ব্যবহৃত হয়।

ওয়েবের জন্য আপনি letterSpacing(বা letter-spacing) ব্যবহার করতে পারেন

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.