সিএসএসের সাথে প্রাকের মতো দেখতে স্প্যান কীভাবে পরিবর্তন করবেন?


108

কোনও <span>ট্যাগের (বা <div>) কোনও বিষয়বস্তু যেমন একটি <pre>ট্যাগ কেবল সিএসএস ব্যবহার করে তার প্রিফর্ম্যাট করা সম্ভব ?

উত্তর:


164

এ লুক W3C এর CSS2.1 ডিফল্ট শৈলী পত্রক বা CSS2.2 ওয়ার্কিং খসড়া । প্রাকের জন্য সমস্ত সেটিংস অনুলিপি করুন এবং এগুলি আপনার নিজের শ্রেণিতে রাখুন।

pre {
    display: block;
    unicode-bidi: embed;
    font-family: monospace;
    white-space: pre;
}

1
এই ডিফল্টগুলি কোথা থেকে এসেছে তা বোঝার জন্য এটি এইভাবে করা ভাল idea
ডায়োডিয়াস - জেমস ম্যাকফার্লেন

2
আমি যখন এটি চেষ্টা করি তখন লাইন ব্রেকগুলি সংরক্ষণ করা হয় না।
অগ্নেল কুরিয়ান

<p>> ট্যাগটি যখন পাঠ্যটি খুব প্রশস্ত হবে তখন অনুভূমিক স্ক্রোলবারগুলি প্রদর্শন করবে তবে এই CSSটি তা করবে না। এগুলি কীভাবে দেখানো হয় কেউ জানেন?
shindigo

1
@ shindigo আপনি কি ব্যবহার করার চেষ্টা করেছেন overflow: scroll? অথবা আপনি যদি কেবল অনুভূমিক স্ক্রোলিং overflow-x: scroll বিকাশকারী
mo মোজিলা.আর.ইন.ইউএস

1
@ শিন্ডিগো আরও overflow: auto;ভাল হতে পারে অন্যথায় আপনার যখন প্রয়োজন হবে না তখন আপনি দুটি সেট স্ক্রোলবার দিয়ে শেষ করতে পারেন।
স্পেশাল


25

এটি স্প্যানটিকে প্রাইয়ের মতো দেখায়:

span {
  white-space: pre;
  font-family: monospace;
  display: block;
}

সিএসএস নির্বাচনকারীকে যথাযথ হিসাবে পরিবর্তন করতে ভুলবেন না।



2

এটা চেষ্টা কর

span {
    white-space: pre;
    font-family: monospace;
    display: block;
    unicode-bidi: embed
}

1

এই শৈলী চেষ্টা করুন

.pre {

white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
line-height: 1.5;   
word-break: break-all;
white-space: pre;
white-space: pre\9; /* IE7+ */
display: block;
}

এখানে একই ব্যবহার করা হয়েছে - http://www.makemyshop.in/


0

স্প্যান ট্যাগের পরিবর্তে কেন কেবল <pre> ট্যাগ ব্যবহার করবেন না? উভয়ই ইনলাইন, তাই উভয়েরই আপনার পছন্দ মতো আচরণ করা উচিত। আপনার যদি <p> সম্পূর্ণ সংজ্ঞাটি ওভাররাইড করতে সমস্যা হয় তবে কেবল এটি একটি শ্রেণি / আইডি দিন।


1
কখনও কখনও আপনার কোনও পৃষ্ঠায় ইতিমধ্যে স্প্যান রয়েছে এবং এটি পরিবর্তন করতে পারবেন না, যেমন এটি কোনও বিদ্যমান সিএমএস সিস্টেমের অংশ কিনা।
মিঃ শাইন এবং নতুন 安

খ / সি কাঠামোটি আমার <প্রাক> উপায়ে যেভাবে আমি এটি জিজ্ঞাসা করছি তার নিচে বিষয়বস্তুগুলি রাখতে অস্বীকার করছে। আমি এটির চারপাশে কাজ করতে পারি, তবে এটি কয়েকটি সিএসএস প্রপস সেট করার চেয়ে অনেক বেশি শক্ত।
jsight
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.