উপাদান ব্যবহার করে: পরে ব্যবহার করে একটি স্পেস ("") যুক্ত করুন


274

কিছু সামগ্রীর পরে আমি একটি ফাঁকা স্থান যুক্ত করতে চাই, তবে content: " ";মনে হয় এটি কার্যকর হবে না।

এটি আমার কোড:

h2:after {
    content: " ";
}

... যা কাজ করে না, তবে এটি করে:

h2:after {
    content: "-";
}

আমি কি ভুল করছি?


2
আমি প্রত্যাশিত ফলাফল বুঝতে পারছি না। আপনি কি paddingব্যবহার করে যোগ করার চেষ্টা করছেন content? দেখে মনে হচ্ছে স্থানটি যুক্ত হয়েছিল কিনা তা বলা অসম্ভব।
fncomp

2
এটি একটি উদ্ভট প্রশ্ন, স্থান যুক্ত করার জন্য আপনার প্যাডিং ব্যবহার করা উচিত , কোনও বিষয়বস্তু নেই: পরে , সম্ভবত আপনি প্রদর্শন: ইনলাইন এবং প্রদর্শন: ব্লকের মধ্যে পার্থক্য সম্পর্কে জানেন না?
লিটলমাড

আমি সামগ্রীর মাধ্যমে প্যাডিং যুক্ত করার চেষ্টা করছি।
bradley.ayers

2
আমি আবিষ্কার করেছি যে এই পদ্ধতিটি ব্যবহার করে একটি স্থান যুক্ত করা তখনও কার্যকর ছিল যখন overflow: hiddenকোনও ব্লক উপাদান ইটালিক পাঠ্যের শেষ অক্ষরের শেষ কয়েকটি পিক্সেল কেটে দেয়। প্যাডিং এই ক্ষেত্রে সাহায্য করবে না।
জো ওয়ালার

3
প্যাডিং সাহায্য করে না যদি আপনি চান যে কোনওভাবে আপনার স্থানটি আন্ডারলাইন করা হোক text-decoration: underline;
dmitry_romanov 16

উত্তর:


142

ব্যাখ্যা

আপনার কোডটি কোনও স্থান সন্নিবেশ করায় তা লক্ষণীয়

h2::after {
  content: " ";
}

তবে এটি অবিলম্বে সরানো হয়েছে।

থেকে বেনামী ইনলাইন বক্স ,

পরে 'হোয়াইট স্পেস' সম্পত্তি অনুসারে ধবংস হয়ে যাওয়া হোয়াইট স্পেস সামগ্রীগুলি কোনও বেনামুক্ত ইনলাইন বাক্স তৈরি করে না।

এবং 'হোয়াইট স্পেস' প্রক্রিয়াকরণ মডেল থেকে ,

যদি কোনও লাইনের শেষে কোনও স্পেস (U + 0020) 'সাদা-স্পেস' সেট করে 'স্বাভাবিক', 'নওর্যাপ', বা 'প্রাক-লাইন' সেট থাকে তবে এটিও সরানো হবে।

সমাধান

সুতরাং আপনি যদি স্থানটি সরানো না চান তবে সেট white-spaceকরুন preবা pre-wrap

h2 {
  text-decoration: underline;
}
h2.space::after {
  content: " ";
  white-space: pre;
}
<h2>I don't have space:</h2>
<h2 class="space">I have space:</h2>

নন-ব্রেকিং স্পেস (U + 00a0) ব্যবহার করবেন না। তাদের কথার মধ্যে লাইন বিরতি রোধ করার কথা। এগুলিকে অ-সঙ্কুচিত স্থান হিসাবে ব্যবহার করার কথা নয়, এটি শব্দার্থক হবে না।


3
দেখে মনে হচ্ছে white-spaceএটি আইই 11 ও এজে তেমন সমর্থিত নয় (দেখুন ক্যানিউজ ::#search= white-space )। সুতরাং ব্যবহারকারী bradley.ayers দ্বারা উত্তর ভাল? (আমি জানি না, শব্দার্থবিজ্ঞান বা লাইন-ব্রেক আচরণের মতো অন্য
দিকগুলিও রয়েছে

561

পালিয়ে যাওয়া ইউনিকোডের মাধ্যমে নির্দিষ্ট করা দরকার Turn এই প্রশ্নটি সম্পর্কিত এবং এর উত্তর রয়েছে।

সমাধান:

h2:after {
    content: "\00a0";
}

64
এটি কোনও অ-BREAKING স্পেস যোগ করবে এমন কিছুই নয়। আপনি যদি একটি সাধারণ স্থান চান তবে আপনার "\ 00A0" এর পরিবর্তে "\ 0020" দরকার।
অফলাইন

4
সাধারণ জায়গাগুলি কোনও কিছুই করবে না তাও লক্ষ করার মতো বিষয় হতে পারে। এতে থাকা লেখার এবং পূর্ববর্তী উপাদানগুলির মধ্যে যদি আপনার কোনও শ্বেত স্পেস না থাকে তবে এটি কোনও যোগ করবে না। একটি সাধারণ স্থান কেবল নিজের মধ্যে ধসে পড়বে।
মোহাম

2
@ আফলিন দয়া করে আলাদা উত্তর হিসাবে `` 0020` যুক্ত করুন কারণ কিছু ফন্ট যেমন, ফন্ট আশ্চর্য \00A0কোনও স্থান প্রদর্শন করতে দেয় না , এবং যদি আপনি প্যাডিং ব্যবহার করতে না পারার আগে বা পরে উপাদানগুলির মধ্যে একটি স্থান চান
মাউসী

ইতিমধ্যে সামগ্রীতে থাকা কোনও কিছুর পরে আপনি কীভাবে স্থান যুক্ত করবেন?
vsync

2
@ ফ্রানসোয়াডুপন্ট, আপনার কাছে এই পরিবর্তনটি বর্ণনা করার মতো কোনও সংস্থান আছে?
ইশারউড

9

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

এরকম কিছু দিয়ে শেষ হয়েছে:

.transaction-tile:after {
  content: "\f105";
}

.transaction-tile:last-child:after {
  content: "\00a0";
}

জিটি (শেভ্রন) চরিত্রের জন্য ব্যবহৃত হরফ যে কোনও কারণে "বিষয়বস্তু: কিছুই নয়" সর্বশেষ টাইল এ প্রান্তিককরণ সমস্যা উত্পাদন ছিল।

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