সিএসএসে চেকবক্সের সীমানা স্টাইলটি কীভাবে পরিবর্তন করবেন?

122

আমি কীভাবে চেকবক্স (ইনপুট) সীমানার স্টাইল পরিবর্তন করতে পারি? আমি border:1px solid #1e5180এটি প্রয়োগ করেছি, তবে ফায়ারফক্স ৩.৫-তে, কিছুই ঘটে না!

html css

— রিকি
সূত্র

63

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

— সোফিয়া
সূত্র

4

অপেরা স্টাইলিংটিকে চেকবক্সে খুব ভালভাবে পরিচালনা করে। আইই এর কিছু স্টাইলিং রয়েছে যা চেকবক্সের চারপাশে মোড়ানো (চেকবক্সে নেই)।

— বিস্মিত

4

আজকাল তারা আসলেই কুৎসিত: ডি

— জার্গেলি ফেহারিভরি

1

2020 এ এখনও কুৎসিত

— পল

210

আমি "বর্ডার" এর পরিবর্তে "আউটলাইন" ব্যবহার করার পরামর্শ দিই। উদাহরণস্বরূপ: outline: 1px solid #1e5180।

— গ্রেগ
সূত্র

3

আউটলাইন একটি দুর্দান্ত বিকল্প।

— নিপ্পিসৌরাস

4

রূপরেখাটি খুব ভাল, এবং এটি সমস্ত ইনপুট এবং নির্বাচনের বাক্সের জন্য কাজ করে, এটি ".error" শ্রেণীর জন্য দরকারী করে।

— SztupY

2

!importantরূপরেখা ব্যবহার করার সময় আপনার সিএসএসে যুক্ত হতে পারে । আমি এটি ফায়ারফক্স 12.0 এ পরীক্ষা করছিলাম এবং ছাড়াই! গুরুত্বপূর্ণ হিসাবে আমি যতক্ষণ না চেকবক্সটি ক্লিক করছিলাম ততক্ষণ মুছে ফেলা হবে।

— উইজলে

3

এটি একটি দুর্দান্ত বিকল্প, তবে রূপরেখার সমস্যাটি এটি আই 7 এ কাজ করে না !!

— ইয়েসস

13

@ ইয়েসস আপনি আই 7 সম্পর্কে চিন্তা করতে হবে? হাই, আমি দুঃখিত।

— theblang

71

আপনার ব্যবহার করা উচিত

-moz-appearance:none;
-webkit-appearance:none;
-o-appearance:none;

তারপরে আপনি ডিফল্ট চেকবক্স চিত্র / শৈলী থেকে মুক্তি পাবেন এবং এটি স্টাইল করতে পারবেন। যাইহোক ফায়ারফক্সে একটি সীমানা থাকবে

— Valerij
সূত্র

2

অপেরা আপনাকে কোনও অতিরিক্ত হ্যাকারি ছাড়াই চেকবক্সগুলি স্টাইল করতে দেয় - আমি-উপস্থিতি স্টাইলটি ছেড়ে দেব। -মোজ-চেহারা এবং-ওয়েবেকিট-চেহারাটি দুর্দান্ত।

— নিল 15

7

উফ - খুব শীঘ্রই কথা বলেছেন: "-ওয়েবেকিট-উপস্থিতি: কিছুই নয়;" চেকবক্স আচরণটি অক্ষম বলে মনে হচ্ছে।

— নিল 15

6

আমার জন্য (ক্রোম 5) এটি করেনি, আপনার স্টাইল করতে হবে: অতিরিক্ত চেক স্টেট

— ভ্যালারিজ

1

উপস্থিতি কখনও সিএসএস স্ট্যান্ডার্ডের অংশ ছিল না। এটা ব্যবহার করোনা.

— ইভজেনি

বাহ এটা দুর্দান্ত আমি প্লাগিনগুলি থেকে মুক্তি পাব। আমি কিছু করতে পারি => | ইনপুট [টাইপ = চেকবক্স] | ইনপুট [প্রকার = চেকবক্স]: হোভার | ইনপুট [প্রকার = চেকবক্স]: চেক | ইনপুট [প্রকার = চেকবক্স]: চেক করা হয়েছে: পরে ...

— h0mayun

21

সীমানা নকল করতে আপনি বাক্সের ছায়া ব্যবহার করতে পারেন:

-webkit-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
-moz-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);

— ডেনিস হেইডেন
সূত্র

@ রিট্রোভার্টিগো কোন সংস্করণ?

— ডেনিস হেইডেন

সংস্করণ 12.0.2 (14606.3.4) / সর্বশেষে ম্যাকোস 10.14

— retrovertigo

@retrovertigo আমি আমার সমাধানটি পরীক্ষা করেছি এবং আপনি ঠিক বলেছেন। আমার উত্তরটি আরও পরিবর্তন ছাড়াই সাফারির পক্ষে কাজ করে না (যেমন-ওয়েবকিট-উপস্থিতি: কিছুই নয়)। 3 বছর পরে, আমি পেন্ডিংফক্স বা আদন দ্বারা প্রদত্ত সমাধানগুলি ব্যবহার করব। তবে আমি কয়েক সপ্তাহের মধ্যে আমার উত্তরটি প্রসারিত করার চেষ্টা করব। আপনার প্রতিক্রিয়ার জন্য ধন্যবাদ।

— ডেনিস হেইডেন

11

মার্টিনের কাস্টম চেকবক্স এবং সিএসএস 3 লিঙ্কের রেডিও বোতামের উপর ভিত্তি করে এখানে একটি খাঁটি সিএসএস (কোনও চিত্র নেই) ক্রস ব্রাউজার সমাধান রয়েছে: http://martinivanov.net/2012/12/21/imageless-custom-checkboxes-and-radio-buttons -সঙ্গে-CSS3-revisited /

এখানে একটি জেএসফিডাল: http://jsfiddle.net/DJRavine/od26wL6n/

আমি নিম্নলিখিত ব্রাউজারগুলিতে এটি পরীক্ষা করেছি:

ফায়ারফক্স (41.0.2) (42)
গুগল ক্রোম (46.0.2490.80 মি)
অপেরা (33.0.1990.43)
ইন্টারনেট এক্সপ্লোরার (11.0.10240.16431 [আপডেট সংস্করণ: 11.0.22])
মাইক্রোসফ্ট এজ (20.10240.16384.0)
সাফারি মোবাইল আইফোন iOS9 (601.1.46)

label,
input[type="radio"] + span,
input[type="radio"] + span::before,
label,
input[type="checkbox"] + span,
input[type="checkbox"] + span::before
{
    display: inline-block;
    vertical-align: middle;
}
 
label *,
label *
{
    cursor: pointer;
}
 
input[type="radio"],
input[type="checkbox"]
{
    opacity: 0;
    position: absolute;
}
 
input[type="radio"] + span,
input[type="checkbox"] + span
{
    font: normal 11px/14px Arial, Sans-serif;
    color: #333;
}
 
label:hover span::before,
label:hover span::before
{
    -moz-box-shadow: 0 0 2px #ccc;
    -webkit-box-shadow: 0 0 2px #ccc;
    box-shadow: 0 0 2px #ccc;
}
 
label:hover span,
label:hover span
{
    color: #000;
}
 
input[type="radio"] + span::before,
input[type="checkbox"] + span::before
{
    content: "";
    width: 12px;
    height: 12px;
    margin: 0 4px 0 0;
    border: solid 1px #a8a8a8;
    line-height: 14px;
    text-align: center;
     
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
     
    background: #f6f6f6;
    background: -moz-radial-gradient(#f6f6f6, #dfdfdf);
    background: -webkit-radial-gradient(#f6f6f6, #dfdfdf);
    background: -ms-radial-gradient(#f6f6f6, #dfdfdf);
    background: -o-radial-gradient(#f6f6f6, #dfdfdf);
    background: radial-gradient(#f6f6f6, #dfdfdf);
}
 
input[type="radio"]:checked + span::before,
input[type="checkbox"]:checked + span::before
{
    color: #666;
}
 
input[type="radio"]:disabled + span,
input[type="checkbox"]:disabled + span
{
    cursor: default;
     
    -moz-opacity: .4;
    -webkit-opacity: .4;
    opacity: .4;
}
 
input[type="checkbox"] + span::before
{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
 
input[type="radio"]:checked + span::before
{
    content: "\2022";
    font-size: 30px;
    margin-top: -1px;
}
 
input[type="checkbox"]:checked + span::before
{
    content: "\2714";
    font-size: 12px;
}



input[class="blue"] + span::before
{
    border: solid 1px blue;
    background: #B2DBFF;
    background: -moz-radial-gradient(#B2DBFF, #dfdfdf);
    background: -webkit-radial-gradient(#B2DBFF, #dfdfdf);
    background: -ms-radial-gradient(#B2DBFF, #dfdfdf);
    background: -o-radial-gradient(#B2DBFF, #dfdfdf);
    background: radial-gradient(#B2DBFF, #dfdfdf);
}
input[class="blue"]:checked + span::before
{
    color: darkblue;
}



input[class="red"] + span::before
{
    border: solid 1px red;
    background: #FF9593;
    background: -moz-radial-gradient(#FF9593, #dfdfdf);
    background: -webkit-radial-gradient(#FF9593, #dfdfdf);
    background: -ms-radial-gradient(#FF9593, #dfdfdf);
    background: -o-radial-gradient(#FF9593, #dfdfdf);
    background: radial-gradient(#FF9593, #dfdfdf);
}
input[class="red"]:checked + span::before
{
    color: darkred;
}

 <label><input type="radio" checked="checked" name="radios-01" /><span>checked radio button</span></label>
 <label><input type="radio" name="radios-01" /><span>unchecked radio button</span></label>
 <label><input type="radio" name="radios-01" disabled="disabled" /><span>disabled radio button</span></label>

<br/>

 <label><input type="radio" checked="checked" name="radios-02"  class="blue" /><span>checked radio button</span></label>
 <label><input type="radio" name="radios-02" class="blue" /><span>unchecked radio button</span></label>
 <label><input type="radio" name="radios-02" disabled="disabled" class="blue" /><span>disabled radio button</span></label>

<br/>

 <label><input type="radio" checked="checked" name="radios-03"  class="red" /><span>checked radio button</span></label>
 <label><input type="radio" name="radios-03" class="red" /><span>unchecked radio button</span></label>
 <label><input type="radio" name="radios-03" disabled="disabled" class="red" /><span>disabled radio button</span></label>

<br/>
 
<label><input type="checkbox" checked="checked" name="checkbox-01" /><span>selected checkbox</span></label>
<label><input type="checkbox" name="checkbox-02" /><span>unselected checkbox</span></label>
<label><input type="checkbox" name="checkbox-03" disabled="disabled" /><span>disabled checkbox</span></label>

<br/>
 
<label><input type="checkbox" checked="checked" name="checkbox-01" class="blue" /><span>selected checkbox</span></label>
<label><input type="checkbox" name="checkbox-02" class="blue" /><span>unselected checkbox</span></label>
<label><input type="checkbox" name="checkbox-03" disabled="disabled" class="blue" /><span>disabled checkbox</span></label>

<br/>
 
<label><input type="checkbox" checked="checked" name="checkbox-01" class="red" /><span>selected checkbox</span></label>
<label><input type="checkbox" name="checkbox-02" class="red" /><span>unselected checkbox</span></label>
<label><input type="checkbox" name="checkbox-03" disabled="disabled" class="red" /><span>disabled checkbox</span></label>

স্নিপেট প্রসারিত করুন

— আদন রেহতলা
সূত্র

10

আমি জানি আমার বয়স পুরানো .. তবে একটু চূড়ান্ত কাজটি হ'ল আপনার চেকবক্সটি একটি লেবেল ট্যাগের ভিতরে রাখা, তারপরে একটি সীমানা সহ লেবেলটি স্টাইল করুন:

<label class='hasborder'><input type='checkbox' /></label>

তারপরে লেবেলটি স্টাইল করুন:

.hasborder { border:1px solid #F00; }

— Hussam
সূত্র

1

এছাড়াও মনে রাখবেন, লেবেল উপাদানটি যখনই ক্লিক করা হবে তখন চেকবক্সটি চেক করবে, এমনকি যদি চেকবক্সটি এর ভিতরে দৃশ্যমান নাও হয়। সুতরাং লেবেলে আপনি এর মতো কিছু করতে পারেন label { position: relative; overflow: hidden; width: 16px; height: 16px; border: 1px solid #0f0; }এবং তারপরে label > input[type=checkbox] { position: absolute; left: -999px; }এটি আপনাকে কাস্টম স্টাইল করতে দেয় আপনার নিজস্ব চেকবক্স এবং মূল চেকবক্সটি এখনও চেক / চেক করা যাবে না তবে ব্যবহারকারী এটি দেখতে পাবে না। তারা কেবল আপনার কাস্টম চেকবক্সটি দেখতে পাবে।

— গ্যাভিন

1

যোগ করতে ভুলে গেছেন, তারপরে আপনি আপনার পছন্দসই চেকবাক্সের অন্যান্য রাজ্যগুলির মতো পছন্দ করতে :hoverএবং :checkedস্টাইল করতে ব্যবহার করতে পারেন ।

— গ্যাভিন

10

এখানে আমার সংস্করণ যা চেকবাক্স টিকারের জন্য ফন্টআউবিজ ব্যবহার করে, আমি মনে করি ফন্টআউজিয়াম প্রায় প্রত্যেকেই ব্যবহার করেছেন সুতরাং আপনার এটিও ধরে নেওয়া নিরাপদ। আইই / এজতে পরীক্ষা করা হয়নি এবং আমি মনে করি না যে কেউ যত্ন করে।

input[type=checkbox] {
	-moz-appearance:none;
	-webkit-appearance:none;
	-o-appearance:none;
	outline: none;
	content: none;	
}

input[type=checkbox]:before {
	font-family: "FontAwesome";
    content: "\f00c";
    font-size: 15px;
    color: transparent !important;
    background: #fef2e0;
    display: block;
    width: 15px;
    height: 15px;
    border: 1px solid black;
    margin-right: 7px;
}

input[type=checkbox]:checked:before {

	color: black !important;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/>

<input type="checkbox">

স্নিপেট প্রসারিত করুন

— pendingfox
সূত্র

9

জন্য ফায়ারফক্স , ক্রোম এবং সাফারি , কিছুই ঘটবে।

জন্য আই ই সীমান্ত চেকবক্সটি (না চেকবক্সটি অংশ হিসেবে) বাহিরে প্রয়োগ করা হয়, এবং "অভিনব" ছায়াকরণ চেকবক্সটি কার্যকর সর্বস্বান্ত (একটি oldfashioned চেকবক্সটি হিসেবে প্রদর্শিত) করা হয়।

জন্য অপেরা সীমানা শৈলী আসলে চেকবক্সটি উপাদান সীমান্ত আবেদন করা হয়।
অপেরা অন্যান্য ব্রাউজারগুলির চেয়ে চেকবক্সে আরও স্টাইলিংগুলি পরিচালনা করে: রঙটি টিকের রঙ হিসাবে প্রয়োগ করা হয়, ব্যাকগ্রাউন্ডের রঙটি চেকবাক্সের অভ্যন্তরে ব্যাকগ্রাউন্ড রঙ হিসাবে প্রয়োগ করা হয় (IE ব্যাকগ্রাউন্ডটি প্রযোজ্য যেমন চেকবক্সটি <div>ব্যাকগ্রাউন্ডের অভ্যন্তরে ছিল )) ।

উপসংহার

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

— সম্ভ্রম
সূত্র

2

+1 টি গবেষণার জন্য, কিন্তু একটি div ভিতরে এটা মোড়কে হয় না একটি সমাধান। এটি আপনাকে চেকবক্সটি স্টাইল করতে দেয় না, এটি আপনাকে চেকবক্সের চারপাশে স্টাইল করতে দেয় , যদি না আপনি এটি আড়াল করার চেষ্টা করে খেলতে শুরু করেন এবং এটির উপরে আঁকা যা এর নিজস্ব সমস্যা রয়েছে।

ওয়েল, একমাত্র ব্রাউজার যা আপনাকে চেকবক্সটি স্টাইল করতে দেয় তা হ'ল অপেরা। একটি ডিভের মধ্যে এটি মোড়ানো একটি সমাধান যা যথেষ্ট ভাল হতে পারে তবে এটি যা আপনি চান তার উপর নির্ভর করে। আপনি যদি চেকবক্সটি স্টাইল করার চেষ্টা করেন তবে আইআই আসলে এটি ডিভিতে রাখার মতো কাজ করে!

— বিস্মিত

7

স্টাইলিং চেকবাক্সগুলি (এবং সেই ম্যাটারের জন্য অনেক অন্যান্য ইনপুট উপাদানগুলি) খাঁটি সিএসএস দিয়ে সত্যই সম্ভব নয় যদি আপনি ভিজ্যুয়াল উপস্থিতিকে তাত্পর্যপূর্ণভাবে পরিবর্তন করতে চান।

আপনার সেরা বাজি হ'ল জকি ট্রান্সফর্মের মতো কিছু বাস্তবায়িত করা যা আসলে আপনার চিত্রগুলির সাথে ইনপুট প্রতিস্থাপন করে এবং এটিতে জাভাস্ক্রিপ্ট আচরণ প্রয়োগ করে একটি চেকবক্সের নকল করতে (বা অন্য বিষয়টির জন্য)

— ChrisR
সূত্র

4

না, আপনি এখনও চেকবাক্সটি নিজেই স্টাইল করতে পারবেন না, তবে কার্যকারিতাটি রাখার সময় আমি কীভাবে একটি ভ্রমকে স্টাইল করতে পারি তা অবশেষে আবিষ্কার করেছি finally চেকবক্সে ক্লিক । এর অর্থ হ'ল পাঠ্য নির্বাচন না করা বা ড্র্যাগ-অ্যান্ড-ড্রপকে ট্রিগার না করে কার্সার পুরোপুরি না থাকলেও আপনি এটিকে টগল করতে পারবেন!

উদাহরণটি একটি স্প্যান "বোতাম" এর পাশাপাশি কোনও লেবেলের কিছু পাঠ্য ব্যবহার করছে তবে এটি আপনাকে কীভাবে চেকবক্সটিকে অদৃশ্য করে তুলতে পারে এবং এর পিছনে কিছু আঁকতে পারে তার ধারণা দেয়।

এই সমাধান সম্ভবত রেডিও বোতাম ফিট করে।

নিম্নলিখিতগুলি আইই 9, এফএফ 30.0 এবং ক্রোম 40.0.2214.91 এ কাজ করে এবং এটি কেবল একটি প্রাথমিক উদাহরণ। আপনি এখনও পটভূমি চিত্র এবং সিউডো-উপাদানগুলির সাথে একত্রে এটি ব্যবহার করতে পারেন।

http://jsfiddle.net/o0xo13yL/1/

label {
    display: inline-block;
    position: relative; /* needed for checkbox absolute positioning */
    background-color: #eee;
    padding: .5rem;
    border: 1px solid #000;
    border-radius: .375rem;
    font-family: "Courier New";
    font-size: 1rem;
    line-height: 1rem;
}

label > input[type="checkbox"] {
    display: block;
    position: absolute; /* remove it from the flow */
    width: 100%;
    height: 100%;
    margin: -.5rem; /* negative the padding of label to cover the "button" */
    cursor: pointer;
    opacity: 0; /* make it transparent */
    z-index: 666; /* place it on top of everything else */
}

label > input[type="checkbox"] + span {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 1px solid #000;
    margin-right: .5rem;
}

label > input[type="checkbox"]:checked + span {
    background-color: #666;
}

<label>
    <input type="checkbox" />
    <span>&nbsp;</span>Label text
</label>

— LGT
সূত্র

2

এখানে একটি সহজ উপায় (সিউডো উপাদান / শ্রেণীর আগে বা পরে ব্যবহারের জন্য):

input[type=checkbox] {
    position: relative;
}

input[type=checkbox]:after {
    position: absolute;
    top: 0;
    left: 0;
    /* Above three lines allow the checkbox:after position at checkbox's position */
    content: '';
    width: 32px;
    height: 32px;
    z-index: 1; /* This allows the after overlap the checkbox */
    /* Anything you want */
}

— অ্যালেক্স ফ্যাং
সূত্র

আমি মনে করি এটি আপনার চেকবক্স এবং এর মতো যে কোনও কিছু পুনরায় সাজানোর একটি দুর্দান্ত উপায়।

— অ্যালেক্স ফ্যাং

1

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

— লিও

লিও, আপনি "বিষয়বস্তু" শব্দের ভুল ব্যাখ্যা দিচ্ছেন, কেবল এটিই বলেছেন যে এই শূন্য উপাদানগুলির মধ্যে সামগ্রী থাকতে পারে না কারণ কোনও বন্ধ করার ট্যাগ নেই। উদাহরণস্বরূপ <a> সামগ্রী </a> এর একটি ক্লোজিং ট্যাগ রয়েছে যাতে এই ট্যাগগুলির মধ্যে একটি সামগ্রী থাকতে পারে। তবে ইনপুটটিতে ক্লোজিং ট্যাগ নেই তাই এটি নীতি অনুসারে বিষয়বস্তু থাকতে পারে না। অন্যদিকে, সিউডো-উপাদানগুলির "কন্টেন্ট" নামে একটি সম্পত্তি রয়েছে যা সর্বত্র ব্যবহার করার অনুমতি রয়েছে।

— পেনশনফক্স

-1

<!DOCTYPE html>
<html>
<head>
<style> 

.abc123
{
	-webkit-appearance:none;
    width: 14px;
    height: 14px;
    display: inline-block;
    background: #FFFFFF;
	border: 1px solid rgba(220,220,225,1);
}
.abc123:after {
  content: "";
  display: inline-block;
  position: relative;
  top: -3px;
  left: 4px;
  width: 3px;
  height: 5px;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  -webkit-transform: rotate(45deg);
}

input[type=checkbox]:checked   {
    background: #327DFF;
    outline: none;
    border: 1px solid rgba(50,125,255,1);
}
input:focus,input:active {
	outline: none;
}

input:hover {
   border: 1px solid rgba(50,125,255,1);
}

</style>
</head>
<body>

<input class="abc123" type="checkbox"></input>


</body>
</html>

স্নিপেট প্রসারিত করুন

— KeepLearn
সূত্র

প্রথম: ": পরে" তৈরি করুন √; দ্বিতীয়: "-ওয়েবেকিট-উপস্থিতি: কিছুই নয়" উত্সের শৈলীটি কাজ করতে পারে না এবং তারপরে আপনি নিজের স্টাইলটি সংজ্ঞায়িত করতে পারেন।

— কিপলার্ন

2

আপনার উত্তর সম্পর্কে একটি সংক্ষিপ্ত বিবরণ লিখুন।

— অ্যাঞ্জেল এফ সাইরাস

-5

এটি একটি ডিভিতে রাখুন এবং ডিভের সীমানা যুক্ত করুন

— Midhat
সূত্র

5

তারপরে আপনার দ্বিগুণ সীমানা থাকবে।

— ডিম পাভলিখিন

<ডি স্টাইল = "বর্ডার-স্টাইল: সলিড; প্রস্থ: 120px;"> <ইনপুট টাইপ = "চেকবক্স" নাম = "মাইচেক"> আমার চেকবক্স </ ইনপুট> </div> এইচটিএমএলস্যান্ডবক্সে দুর্দান্ত কাজ করে

— মিডহাট

8

'ফাইন কাজ করে' সংজ্ঞায়িত করুন। উদাহরণস্বরূপ, আমি কখনও 120px প্রশস্ত একটি চেকবক্স দেখিনি।

-8

<div style="border-style: solid;width:13px"> 
   <input type="checkbox" name="mycheck" style="margin:0;padding:0;">
   </input> 
</div>

— Midhat
সূত্র

7

@ ফ্লেকু </ ইনপুট>