it-swarm.asia

كيفية إزالة الحدود (مخطط) حول مربعات النص/الإدخال؟ (كروم)

هل يمكن لأي شخص شرح كيفية إزالة الحدود البرتقالية أو الزرقاء (مخطط تفصيلي) حول مربعات النص/الإدخال؟ أعتقد أنه يحدث فقط على Chrome لإظهار أن مربع الإدخال نشط. فيما يلي مدخلات CSS التي أستخدمها:

input {
    background-color: transparent;
    border: 0px solid;
    height: 20px;
    width: 160px;
    color: #CCC;
}

enter image description here

1108
Joey Morani

يتم استخدام هذا الحد لإظهار تركيز العنصر (أي يمكنك كتابة الإدخال أو الضغط على الزر مع إدخال). يمكنك إزالته ، على الرغم من:

textarea:focus, input:focus{
    outline: none;
}

قد ترغب في إضافة طريقة أخرى للمستخدمين لمعرفة العنصر الذي يحتوي على تركيز لوحة المفاتيح على الرغم من سهولة الاستخدام.

سيقوم Chrome أيضًا بتطبيق التمييز على عناصر أخرى مثل DIV's المستخدمة كشرطات. لمنع التمييز على هذه العناصر وجميع العناصر الأخرى أيضًا ، يمكنك القيام بما يلي:

*:focus {
    outline: none;
}
2021
CEich

الإجابة الحالية لم تنجح مع Bootstrap 3.1.1. إليك ما يجب علي تجاوزه:

.form-control:focus {
  border-color: inherit;
  -webkit-box-shadow: none;
  box-shadow: none;
}
129
gwintrob
input:focus {
    outline:none;
}

هذا سوف يفعل. مخطط البرتقال لن يظهر بعد الآن.

88
azram19
<input style="border:none" >

عملت بشكل جيد بالنسبة لي. تمنى أن يكون ثابتًا في html نفسه ... :)

57
Kailas

لقد وجدت الحل.
اعتدت: outline:none; في CSS ويبدو أنه نجح. شكرا للمساعدة على أي حال. :)

37
Joey Morani

حل

*:focus {
    outline: 0;
}

ملاحظة: استخدم outline:0 بدلاً من outline:none في التركيز. انها ممارسة صالحة وأفضل.

24
Touhid Rahman

هذا إزالة الإطار البرتقالي في الكروم من جميع وأي عنصر بغض النظر عن ماذا وأين هو

*:focus {
    outline: none;
}
20
nonamehere

يرجى استخدام بناء الجملة التالي لإزالة حدود مربع النص وإزالة الحدود المميزة لنمط المتصفح.

input {
    background-color:transparent;
    border: 0px solid;
    height:30px;
    width:260px;
}
input:focus {
    outline:none;
}
16
Tabish

جلس

input:focus{
    outline: 0 none;
}

"! المهم" هو فقط في حالة. هذا ليس ضروريا. [والآن انتهى الأمر. افتتاحية.]

12
madd

اكتشفت أنه يمكنك أيضًا استخدام:

input:focus{
   border: transparent;
}
11
Refilon

هذا سوف يعمل بالتأكيد. لن يظهر مخطط Orange بعد الآن .. شائع لجميع العلامات:

*:focus {
    outline: none;
}

محددة لبعض العلامات ، على سبيل المثال: علامة الإدخال

input:focus {
   outline:none;
}
10
Prashant Gupta