ลบเส้นขอบออกจากปุ่ม

ฉันพยายามสร้างปุ่มและแทรกรูปภาพของตัวเองแทนรูปภาพปุ่มมาตรฐาน อย่างไรก็ตามเส้นขอบสีเทาจากปุ่มมาตรฐานยังคงปรากฏอยู่ด้านนอกของภาพปุ่มสีดำของฉัน

ไม่มีใครรู้วิธีลบเส้นขอบสีเทานี้ออกจากปุ่มดังนั้นมันจึงเป็นเพียงภาพเท่านั้นเอง? ขอบคุณ.

เพิ่ม

padding: 0;
border: none;
background: none;

ไปที่ปุ่มของคุณ

การสาธิต:

https://jsfiddle.net/Vestride/dkr9b/

ดูเหมือนว่าจะได้ผลสำหรับฉันอย่างสมบูรณ์แบบ

button:focus { outline: none; }

ฉันประสบปัญหาเดียวกันและแม้ว่าฉันจะจัดแต่งทรงผมปุ่มใน CSS แต่ก็จะไม่รับborder:noneแต่สิ่งที่ได้ผลคือการเพิ่มสไตล์โดยตรงบนปุ่มอินพุตดังนี้:

<div style="text-align:center;">
    <input type="submit" class="SubmitButtonClass" style="border:none;" value="" />
</div>

ลองใช้: border:0;หรือborder:none;

เคล็ดลับปกติคือทำให้รูปภาพเป็นส่วนหนึ่งของลิงก์แทนที่จะเป็นปุ่ม จากนั้นคุณเชื่อมโยงเหตุการณ์ "คลิก" กับตัวจัดการที่กำหนดเอง

เฟรมเวิร์กเช่น Jquery-UI หรือ Bootstrap ทำสิ่งนี้ได้ทันที การใช้หนึ่งในนั้นอาจช่วยลดความคิดของแอปพลิเคชันทั้งหมดได้มาก

คุณยังสามารถลองbackground:none;border:0pxใช้ปุ่มต่างๆ

นอกจากนี้ยังมีตัวเลือก CSS ที่มีและdiv#yes button{..} div#no button{..}หวังว่ามันจะช่วยได้

เพิ่มสิ่งนี้เป็น css

button[type=submit]{border:none;}

สำหรับการลบค่าเริ่มต้น 'blue-border' ออกจากปุ่มบนปุ่มโฟกัส:

ใน Html:

<button class="new-button">New Button...</button>

และใน Css

button.new-button:focus {
    outline: none;
}

หวังว่าจะช่วยได้ :)

$ (". myButtonClass"). css (["border: none; background-color: white; padding: 0"]);