html কোন বুলেট ছাড়া একটি unordered তালিকা প্রয়োজন




css (22)

আমি একটি unordered তালিকা তৈরি করেছেন। আমি unordered তালিকায় বুলেট বিরক্তিকর মনে হয়, তাই আমি তাদের অপসারণ করতে চান।

বুলেট ছাড়া একটি তালিকা আছে কি?


Answer #1

আপনি একা এই বিশুদ্ধ এইচটিএমএল সম্পন্ন করতে চেয়েছিলেন, এই সমাধান সব প্রধান ব্রাউজার জুড়ে কাজ করবে:

বর্ণনা তালিকা

শুধু নিম্নলিখিত এইচটিএমএল ব্যবহার করে:

<dl>
  <dt>List Item 1</dt>
    <dd>Sub-Item 1.1</dd>
  <dt>List Item 2</dt>
    <dd>Sub-Item 2.1</dd>
    <dd>Sub-Item 2.2</dd>
    <dd>Sub-Item 2.3</dd>
  <dt>List Item 3</dt>
    <dd>Sub-Item 3.1</dd>
</dl>

যা নীচের অনুরূপ একটি তালিকা উত্পাদন করবে:

List Item 1
     Sub-Item 1.1
List Item 2
     Sub-Item 2.1
     Sub-Item 2.2
     Sub-Item 2.3
List Item 3
     Sub-Item 3.1

এখানে উদাহরণ: https://jsfiddle.net/zumcmvma/2/

এখানে রেফারেন্স: https://www.w3schools.com/tags/tag_dl.asp


Answer #2

পূর্বে যেমন উল্লেখ করা হয়েছে, এটি করার সর্বোত্তম উপায় হল list-style-type: none উল উপাদানটির list-style-type: none । আপনি here থেকে উপকার হতে পারে মনে হয় বুলেট শৈলী উপর একটি মহান নিবন্ধ here


Answer #3

সিএসএস কোড

ul
{
list-style-type: none;
}

এইচটিএমএল কোড

<ul>
<li><a href="#">Item One</a></li>
<li><a href="#">Item Two</a></li>   
</ul>

Answer #4

নীচে কোড একটি unordered তালিকা জন্য মুছে ফেলা বুলেট একটি ভাল এবং সহজ উদাহরণ

<!DOCTYPE html>
<html>
<body>

<h2>Unordered List without Bullets</h2>

<ul style="list-style-type:none">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>  

</body>
</html>

Answer #5

সিএসএস:

.liststyle {
    list-style-type: none;
}

এইচটিএমএল:

<ul class="liststyle">
    <li>Test</li>
</ul>

Answer #6
 <div class="custom-control custom-checkbox left">
    <ul class="list-unstyled">
        <li>
         <label class="btn btn-secondary text-left" style="width:100%;text-align:left;padding:2px;">
           <input type="checkbox" style="zoom:1.7;vertical-align:bottom;" asp-for="@Model[i].IsChecked" class="custom-control-input" /> @Model[i].Title
         </label>
        </li>
     </ul>
</div>

Answer #7

নিম্নলিখিত সিএসএস ব্যবহার করুন:

ul {
  list-style-type: none
}

Answer #8

আপনি বুটস্ট্র্যাপ ব্যবহার করছেন, এটি একটি "unstyled" বর্গ আছে:

তালিকা আইটেমগুলির উপর ডিফল্ট তালিকা-শৈলী এবং বাম প্যাডিং সরান (শুধুমাত্র অবিলম্বে শিশু)।

বুটস্ট্র্যাপ 2:

<ul class="unstyled">
   <li>...</li>
</ul>

http://twitter.github.io/bootstrap/base-css.html#typography

বুটস্ট্র্যাপ 3 এবং 4:

<ul class="list-unstyled">
   <li>...</li>
</ul>

http://getbootstrap.com/css/#type-lists


Answer #9

আপনি CSS তালিকা-শৈলী টাইপ ব্যবহার করতে হবে: none;

ul {
  list-style-type: none;
}


Answer #10

আপনি প্যারেন্ট উপাদান (সাধারণত একটি <ul> ) জন্য CSS- এ list-style-type সেট করে বুলেটগুলি সরাতে পারেন, উদাহরণস্বরূপ:

ul {
  list-style-type: none;
}

আপনি padding: 0 যুক্ত করতে চাইতে পারেন padding: 0 এবং margin: 0 , যদি আপনি ইন্ডেন্টেশনটি সরাতে চান।

তালিকা বিন্যাস কৌশল একটি মহান walkthrough জন্য তালিকা Listutorial দেখুন।


Answer #11

এমনকি আপনি এই কাজ করতে পারেন।

ul {
  display: initial;
}

Answer #12

CSS, শৈলী,

 list-style-type: none;

Answer #13

আপনি নিম্নলিখিত CSS ব্যবহার করে বুলেটগুলি সরাতে পারেন:

    ul {
         list-style: none; //or list-style-type:none; 
       }

আপনি এমনকি আপনার কাস্টম তালিকা শৈলী যোগ করতে পারেন:

li:before {
            content: '✔';
            color:red;
          }

Answer #14

আপনাকে list-style: none; ব্যবহার করতে হবে list-style: none;

<ul style="list-style: none;">
    <li> ...</li>
</ul>

Answer #15

আপনি style="list-style-type:none" ব্যবহার করে বুলেটগুলি সরাতে পারেন।

এটা চেষ্টা কর:

<ul style="list-style-type:none" >

     <li>op1</li>
     <li>op2</li>
     <li>op2</li>

</ul> 

Answer #16

আপনি এই চেষ্টা করতে পারেন

ul {
  list-style: none
}
<ul>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
<li>List 4</li>
</ul>


Answer #17

আপনাকে নিম্নরূপ <ul> উপাদানতে শৈলী যুক্ত করতে হবে:

<ul style="list-style: none; ">
    <li>Item</li>
    ...
    <li>Item</li>
</ul>

যে বুলেট মুছে ফেলা হবে। আপনি উপরের উদাহরণগুলির মত স্টাইলশীটে সিএসএস যুক্ত করতে পারেন।


Answer #18

যদি আপনি এটি <ul> স্তরে কাজ করতে অক্ষম হন তবে আপনাকে list-style-type: none; <li> স্তরে:

<ul>
    <li style="list-style-type: none;">Item 1</li>
    <li style="list-style-type: none;">Item 2</li>
</ul>

আপনি এই পুনরাবৃত্তি এড়ানোর জন্য একটি CSS শ্রেণী তৈরি করতে পারেন:

<style>
ul.no-bullets li 
{
    list-style-type: none;
}
</style>

<ul class="no-bullets">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

সম্পাদনা করুন: যখন প্রয়োজন, ব্যবহার করুন !important :

<style>
ul.no-bullets li 
{
    list-style-type: none !important;
}
</style>

Answer #19

স্থানীয়:

ul { list-style-type: none; }

বুটস্ট্র্যাপ:

<ul class="list-unstyled list-group">
    <li class="list-group-item">...</li>
</ul>

দ্রষ্টব্য: যদি আপনি তালিকা-গোষ্ঠীগুলি ব্যবহার করেন তবে তালিকা-অস্তিত্বের প্রয়োজন নেই।


Answer #20

যদি আপনি CSS টি ব্যবহার না করেই জিনিসগুলি সহজ রাখতে চান, তবে আমি কেবল একটি &nbsp; আমার কোড লাইন। আমি <table></table> হ্যাঁ এটা কিছু স্পেস ছেড়ে কিন্তু যে কোন খারাপ জিনিস।


Answer #21

আমি উল এবং লি উভয় বুলেট মুছে ফেলার জন্য তালিকা-শৈলী ব্যবহৃত। আমি একটি কাস্টম চরিত্র সঙ্গে বুলেট প্রতিস্থাপন চেয়েছিলেন, এই ক্ষেত্রে একটি 'ড্যাশ', যে একটি চমৎকার প্রভাব দেয়। তাই এই মার্কআপ ব্যবহার করে:

<ul class="dashed-list">
  <li>text</li>
  <li>text</li>
</ul>

এই CSS সঙ্গে:

ul.dashed-list
{
    list-style: none outside none;
}

ul.dashed-list li:before {
    content: "\2014";
    float: left;
    margin: 0 0 0 -27px;
    padding: 0;
}

ul.dashed-list li {
    list-style-type: none;
}

টেক্সট wraps যখন কাজ করে যে একটি চমত্কারভাবে ইন্ডেন্ট প্রভাব দেয়


Answer #22

<li> জন্য আপনার শ্রেণিতে আপনার list-style-type বা list-style পরিবর্তন করুন।

এটার মতো কিছু:

li {
  list-style-type : none;
}

এছাড়াও আরও তথ্যের জন্য, আমি তালিকা list-style-type জন্য নির্ধারিত সমস্ত বৈশিষ্ট্য তালিকাবদ্ধ করে, একটি ফলাফলের মধ্যে সমস্ত ফলাফল দেখতে নীচের কোডটি চালান:

.none {
  list-style-type: none;
}

.disc {
  list-style-type: disc;
}

.circle {
  list-style-type: circle;
}

.square {
  list-style-type: square;
}

.decimal {
  list-style-type: decimal;
}

.georgian {
  list-style-type: georgian;
}

.cjk-ideographic {
  list-style-type: cjk-ideographic;
}

.kannada {
  list-style-type: kannada;
}

.custom:before {
  content: '◊ ';
  color: red;
}
<ul>
  <li class="none">none</li>
  <li class="disc">disc</li>
  <li class="circle">circle</li>
  <li class="square">square</li>
  <li class="decimal">decimal</li>
  <li class="georgian">georgian</li>
  <li class="cjk-ideographic">cjk-ideographic</li>
  <li class="kannada">kannada</li>
  <li class="none custom">custom</li>
</ul>







css