টেবিল ঘরে কীভাবে মাল্টলাইন পাঠ্য প্রদর্শন করতে হয়


119

আমি একটি টেবিলের ঘরে ডাটাবেস থেকে একটি অনুচ্ছেদ প্রদর্শন করতে চাই।

এর ফলাফল কীভাবে এটি ডাটাবেসে সংগঠিত হয় তা উপেক্ষা করে একটি বড় 1 লাইন is উদাহরণস্বরূপ 'প্রবেশ' উপেক্ষা করা (নতুন লাইন)

এটি ডাটাবেজে কীভাবে লেখা হয়েছে ঠিক সেই অনুসারে এটি দেখাতে চাই।

উদাহরণস্বরূপ, যদি অনুচ্ছেদটি এভাবে সংরক্ষণ করা হয়:

hello ,
my name is x.

আমি এটির পরিবর্তে একে একে ঠিক প্রদর্শন করা চাই:

hello, myname is x.

উত্তর:


164

আপনি white-space:preউপযুক্ত প্রয়োগ করা সিএসএস ব্যবহার করতে চান <td>। সমস্ত টেবিল কোষে এটি করার জন্য, উদাহরণস্বরূপ:

td { white-space:pre }

বিকল্পভাবে, আপনি যদি নিজের মার্কআপ পরিবর্তন করতে পারেন তবে আপনি <pre>আপনার সামগ্রীর চারপাশে একটি ট্যাগ ব্যবহার করতে পারেন । ডিফল্টরূপে ওয়েব ব্রাউজারগুলি white-space:preএই উপাদানটিতে একই নিয়ম প্রয়োগ করতে তাদের ব্যবহারকারী-এজেন্ট স্টাইলশিট ব্যবহার করে ।

পিআরই উপাদানটি ভিজ্যুয়াল ব্যবহারকারী এজেন্টদের বলে যে বদ্ধ টেক্সটটি "পূর্বরূপিত"। পূর্বনির্দিষ্ট পাঠ্য পরিচালনা করার সময়, ভিজ্যুয়াল ব্যবহারকারী এজেন্ট:

  • অক্ষত সাদা স্থান ছেড়ে যেতে পারে।
  • একটি নির্দিষ্ট-পিচ ফন্টের সাহায্যে পাঠ্য রেন্ডার করতে পারে।
  • স্বয়ংক্রিয় শব্দ মোড়ানো অক্ষম করতে পারে।
  • দ্বি নির্দেশামূলক প্রক্রিয়াজাতকরণ অক্ষম করা উচিত নয়।

থাম্বস আপ, white-spaceএকটি সিএসএস 2.1 সম্পত্তি যা ব্যাপকভাবে সমর্থিত। আইই 8 তে পরীক্ষিত, দুর্দান্ত কাজ করে।
লিজেই

আমি এখন এমন পরিস্থিতিতে আছি যেখানে white-space: pre;কোনও <td>ট্যাগ প্রয়োগ করার সময় অগ্রাহ্য করা হচ্ছে । <pre></pre>আমাদের বিষয়বস্তু মোড়ানোর জন্য ব্যবহার দুর্দান্ত কাজ করে তবে এই টেবিলটি ব্যবহারের কারণে (এক্সেলকে রফতানি করা হচ্ছে), বৃহত্তর # কলাম এবং সারি রফতানি করা ফাইলের আকারের বেলুন এবং ফাইলটি পড়ার পরে এক্সেলকে ক্রাশ করতে পারে। (বিজোড়, আমি জানি) অন্য কেউ এটি দেখেছেন বা সমাধানের জন্য ধারণা পেয়েছেন?
জোব্রোকহাউস

1
এই সমাধানটি নিখুঁত হওয়া থেকে দূরে। এটি ফলাফল করে যে এক্সেলটি এমন কক্ষগুলির জন্য একাধিক লাইন তৈরি করে যেখানে লাইনব্রেক রয়েছে। একমাত্র সঠিক উত্তরটি এখানে পাওয়া যাবে: bennadel.com/blog/…
এলময়ে

55
style="white-space:pre-wrap; word-wrap:break-word"

এটি নতুন লাইনের সমস্যা সমাধান করবে। প্রাক ট্যাগ প্রয়োজনের তুলনায় অতিরিক্ত সিএসএস যোগ করবে।


1
এটি একটি দুর্দান্ত, লক্ষ্যযুক্ত সমাধান। <pre>ট্যাগ মাত্র, যার ফলে সম্পর্কে newline অক্ষর অতিক্রম সব ধরনের জিনিস আছে, কিন্তু এই শৈলী সেটিংস একমাত্র সমস্যা উপস্থাপন সমাধানের জন্য।
মুভিসন

আমার একটি সমস্যা ছিল যাতে আমার ডেটাতে নতুন লাইন থাকে। অন্যান্য সমাধান যেমন পাঠ্য প্রতিস্থাপনের সাথে <br/> বা <ডিভি> বা <পছন্দ> কেবল পাঠ্য হিসাবে বিবেচিত হচ্ছিল। এই সমাধানটি সেই সমস্যাটি কাটিয়ে উঠতে পুরোপুরি কাজ করে।
আনশুমান গোয়েল

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

1
এটি লাইন ব্রেকগুলি সংরক্ষণের ক্ষেত্রে আমার পক্ষে কাজ করে তবে প্রতিটি ঘরের শীর্ষে একটি লাইন ব্রেক যোগ করে ... কোনও সমাধান?
jtr13

30

একটি <pre>(প্রাক-বিন্যাসযুক্ত পাঠ্য) ট্যাগে লিখিত সামগ্রী মোড়ানো

<pre>hello ,
my name is x.</pre>

3
এটি অবশ্য মোনস্পেসের সাহায্যে ফন্টটি ওভাররাইট করে।
হার্ডমথ

23

এই সমস্যা সমাধানের জন্য দুটি পরামর্শ:

সমাধান 1: <div style="white-space:pre;">{database text}</div>বা<pre>{database text}</pre>

আপনার পাঠ্যের কোনও এইচটিএমএল ট্যাগ বা সিএসএসের বৈশিষ্ট্য না থাকলে এটি ভাল সমাধান। উদাহরণস্বরূপ ট্যাব বজায় রাখার অনুমতি দেয়।

সমাধান 2: প্রতিস্থাপন \nসঙ্গে<p></p> or <br/>

আপনি যদি অন্য পাঠ্যের বৈশিষ্ট্য বা বিন্যাস বিনা ব্যতীত ব্রেক-লাইন যুক্ত করতে চান তবে এটি একটি সমাধান। পিএইচপি একটি উদাহরণ হতে হবে$text = str_replace("\n","<br />",$database_text);

আপনি এটিও ব্যবহার করতে পারেন <p></p>বা করতে পারেন <div></div>তবে এর জন্য আরও কিছুটা পাঠ্য বিশ্লেষণের প্রয়োজন।


7

আপনার সার্ভার-সাইড কোডে, নতুন লাইনগুলি ( \n) এর সাথে প্রতিস্থাপন করুন <br/>

আপনি যদি পিএইচপি ব্যবহার করেন তবে আপনি ব্যবহার করতে পারেন nl2br()


6

হাই আমার একই জিনিস করা দরকার! জিজ্ঞাসা করবেন না তবে আমি পাইথন ব্যবহার করে এইচটিএমএল তৈরি করছিলাম এবং তালিকার আইটেমগুলির মধ্য দিয়ে লুপ করার জন্য একটি পদ্ধতির দরকার ছিল এবং প্রতিটি আইটেমের একটি টেবিলের একটি একক সেলের সাথে তার নিজস্ব সারি নেওয়া উচিত।

আমি দেখতে পেলাম যে বিআর ট্যাগটি আমার পক্ষে ভাল কাজ করেছে। উদাহরণ স্বরূপ:

<!DOCTYPE html>
<HTML>
    <HEAD>
        <TITLE></TITLE>
    </HEAD>
    <BODY>
  <TABLE>
            <TR>
                <TD>
                    item 1 <BR>
                    item 2 <BR>
                    item 3 <BR>
                    item 4 <BR>
                </TD>
            </TR>
        </TABLE>
  </BODY>

এটি যে আউটপুটটি চেয়েছিলাম তা উত্পাদন করবে।


5

আমি প্রতিটি লাইনের পরে এইচটিএমএল কোড ট্যাগ ব্যবহার করি (নীচে দেখুন) এবং এটি আমার জন্য কাজ করে।

George Benson </br> 123 Main Street </br> New York, Ny 12344 </br>


2
এটি একটি মন্তব্য নয় একটি উত্তর হতে হবে।
দীপ শর্মা

<br> টেবিলের শব্দার্থক শব্দগুলি ভেঙে দেয়। পাঠ্য-ভিত্তিক ব্রাউজার ব্যবহার করে টেবিলটি দেখার সময়, নতুন লাইনগুলি টেবিল সারিগুলির মতো দেখানো হয়।
JAT86


1

আমি কেবল এর <br>ভিতরে যুক্ত করেছি <td>এবং এটি ভাল কাজ করে, লাইনটি ভেঙে দিন!


0

\nএটির সাথে যদি আপনার স্ট্রিং ভেরিয়েবল থাকে তবে আপনি ভিতরে রাখতে চান td, আপনি চেষ্টা করতে পারেন

<td>
    {value
        .split('\n')
        .map((s, index) => (
            <React.Fragment key={index}>
                {s}
                <br />
            </React.Fragment>
        ))}
</td>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.