Skip to content

Instantly share code, notes, and snippets.

@7cc
Last active Apr 4, 2019
Embed
What would you like to do?
no dot for links, input, button
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>remove dot</title>
<link rel="stylesheet" href="no-dot.css" type="text/css" />
</head>
<body>
<h1>remove dotted-outline from links, button</h1>
<h2>dotted</h2>
<p>
<a href="javascript:;">a</a>
<a href="javascript:;">
<img src="https://cdn1.www.st-hatena.com/users/u_/u_7cc/profile.gif" alt="profile">
</a>
<button>btn</button>
</p>
<h2>no-dotted</h2>
<p id="no-dot">
<a href="javascript:;">a</a>
<a href="javascript:;">
<img src="https://cdn1.www.st-hatena.com/users/u_/u_7cc/profile.gif" alt="profile">
</a>
<button>btn</button>
</p>
<script type="text/javascript" src="no-dot.js"></script>
</body>
</html>
/* IE8+ & other */
#no-dot > a, #no-dot > button {
outline: none
/*outline-style: none */
}
/* Firefox input, button */
#no-dot > button::-moz-focus-inner {
border: 0
}
/* IE5.5 - 7 */
var noDot = document.getElementById("no-dot")
, childs = noDot.childNodes;
for (var i=childs.length; i--;) {
if (childs.tagName) {
childs[i].hideFucus = true
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment