<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CodePen - NEU KEYBOARD </title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="keyboard">
<div class="key s2 esc" data-key="ð">ð</div>
<div class="key" on-shift="!" data-key="1">1</div>
<div class="key" on-shift="@" data-key="2">2</div>
<div class="key" on-shift="#" data-key="3">3</div>
<div class="key" on-shift="$" data-key="4">4</div>
<div class="key" on-shift="%" data-key="5">5</div>
<div class="key" on-shift="^" data-key="6">6</div>
<div class="key" on-shift="&" data-key="7">7</div>
<div class="key" on-shift="*" data-key="8">8</div>
<div class="key" on-shift="(" data-key="9">9</div>
<div class="key" on-shift=")" data-key="0">0</div>
<div class="key sub" on-shift="_" data-key="-">-</div>
<div class="key add" on-shift="+" data-key="=">=</div>
<div class="key s4 back" data-key="ð
">ð
</div>
<div class="key s3 tab" data-key="ð">ð</div>
<div class="key" data-key="Q">Q</div>
<div class="key" data-key="W">W</div>
<div class="key" data-key="E">E</div>
<div class="key" data-key="R">R</div>
<div class="key" data-key="T">T</div>
<div class="key" data-key="Y">Y</div>
<div class="key" data-key="U">U</div>
<div class="key" data-key="I">I</div>
<div class="key" data-key="O">O</div>
<div class="key" data-key="P">P</div>
<div class="key openbracket" on-shift="{" data-key="[">[</div>
<div class="key closebracket" on-shift="}" data-key="]">]</div>
<div class="key s3 pipe" on-shift="|" data-key="\">\</div>
<div class="key s4 cap" data-key="ð">ð</div>
<div class="key" data-key="A">A</div>
<div class="key" data-key="S">S</div>
<div class="key" data-key="D">D</div>
<div class="key dotted" data-key="F">F</div>
<div class="key" data-key="G">G</div>
<div class="key" data-key="H">H</div>
<div class="key dotted" data-key="J">J</div>
<div class="key" data-key="K">K</div>
<div class="key" data-key="L">L</div>
<div class="key semi" on-shift=":" data-key=";">;</div>
<div class="key comma" on-shift=""" data-key=",">,</div>
<div class="key s4 enter" data-key="ð¤">ð¤</div>
<div class="key s5 shift" data-key="ðª">ðª</div>
<div class="key" data-key="Z">Z</div>
<div class="key" data-key="X">X</div>
<div class="key" data-key="C">C</div>
<div class="key" data-key="V">V</div>
<div class="key" data-key="B">B</div>
<div class="key" data-key="N">N</div>
<div class="key" data-key="M">M</div>
<div class="key openangular" on-shift="<" data-key=",">,</div>
<div class="key closeangular" on-shift=">" data-key=".">.</div>
<div class="key slash" on-shift="?" data-key="">/</div>
<div class="key s5 shift up" data-key="ðª">ðª</div>
<div class="key s3 control" data-key="â">â</div>
<div class="key s3 win" data-key="ð¤©">ð¤©</div>
<div class="key s3 alt" data-key="âï¸">âï¸</div>
<div class="key s12 space" data-key=""></div>
<div class="key s3 alt" data-key="âï¸">âï¸</div>
<div class="key s2 fn left" data-key="ð">ð</div>
<div class="key s2 fn down" data-key="ð¨âð»">ð¨âð»</div>
<div class="key s2 control right" data-key="â">â</div>
</div>
<script src="js/script.js"></script>
<div style="text-align:center;margin:1px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>éç¨æµè§å¨ï¼360ãFireFoxãChromeãOperaãå²æ¸¸ãæçãä¸çä¹çª. ä¸æ¯æSafariãIE8å以ä¸æµè§å¨ã</p>
<p>æ´å¤æºç <a href="http://www.96flw.com" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>
