วิธีหยุดการไฮไลต์องค์ประกอบ div เมื่อดับเบิลคลิก

ฉันมีองค์ประกอบ div นี้พร้อมภาพพื้นหลังและฉันต้องการหยุดไฮไลต์ในองค์ประกอบ div เมื่อดับเบิลคลิก มีคุณสมบัติ CSS สำหรับสิ่งนี้หรือไม่?

CSS ด้านล่างนี้จะป้องกันไม่ให้ผู้ใช้เลือกข้อความได้ ตัวอย่างสด: http://jsfiddle.net/hGTwu/20/

-webkit-user-select: none; /* Chrome/Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */

/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;

ในการกำหนดเป้าหมาย IE9 ลงและ Opera unselectableต้องใช้แอตทริบิวต์ html แทน:

<div unselectable="on">Test Text</div>

สิ่งนี้ใช้ได้กับฉัน

html
{
  -webkit-tap-highlight-color:transparent;
}

ฉันพยายามหาวิธีหยุดการไฮไลต์ div ใน Chrome และหันมาที่โพสต์นี้ แต่น่าเสียดายที่ไม่มีคำตอบใดช่วยแก้ปัญหาของฉันได้

หลังจากการค้นคว้าทางออนไลน์มากมายฉันพบว่าการแก้ไขเป็นสิ่งที่ง่ายมาก ไม่จำเป็นต้องมี CSS ที่ซับซ้อนใด ๆ เพียงเพิ่ม CSS ต่อไปนี้ในหน้าเว็บของคุณเท่านี้คุณก็พร้อมแล้ว ซึ่งใช้ได้กับแล็ปท็อปและหน้าจอมือถือ

div { outline-style:none;}

หมายเหตุ : ใช้ได้ใน Chrome เวอร์ชัน 44.0.2403.155 ม. นอกจากนี้ยังรองรับในเบราว์เซอร์หลัก ๆ ทั้งหมดในปัจจุบันตามที่อธิบายไว้ใน url นี้: https://developer.mozilla.org/en-US/docs/Web/CSS/outline-style

ฉันไม่ใช่ผู้เชี่ยวชาญด้าน CSS แต่ฉันคิดว่าคุณสามารถใช้คำตอบของ tw16 ได้ตราบเท่าที่คุณขยายจำนวนองค์ประกอบที่ได้รับผลกระทบ ตัวอย่างเช่นการทำเช่นนี้จะป้องกันไม่ให้ไฮไลต์ทุกที่บนหน้าของฉันโดยไม่ส่งผลต่อการโต้ตอบประเภทอื่น

*, *:before, *:after {
    -webkit-user-select: none; /* Chrome/Safari */        
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
}

บรรทัดแรกนั้นได้รับความอนุเคราะห์จาก Paul Irish (ผ่านhttp://adamschwartz.co/magic-of-css/chapters/1-the-box/ )

กำหนดเป้าหมายองค์ประกอบ div ทั้งหมด:

div::-moz-selection { background:transparent; }
div::selection { background:transparent; }

กำหนดเป้าหมายองค์ประกอบทั้งหมด:

::-moz-selection { background:transparent; }
::selection { background:transparent; }

ปิดการใช้งานผู้ใช้เลือก:

div {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

ตั้งค่าพื้นหลังโปร่งใสสำหรับองค์ประกอบที่เลือก:

div::-moz-selection { background:transparent; }
div::selection { background:transparent; }

หากองค์ประกอบสามารถคลิกได้คุณอาจต้องการทำให้เป็นองค์ประกอบปุ่ม