Pratibook: Sitenize Çok Güzel Bir Hesap Makinesi Ekleyin Kodu- HTML KOD CANAVARI

Nice Calculator

Sitenize Çok güzel bir css ekleyin Sitenize Gerçek Hesap Makinesi Eklemek İstemez misiniz?Bu hesap makinesi o kadar şık ve eğlenceliki eğitim ile ilgili bir web siteniz varsa kesinlikle öneriyorum,Blogger ınızın hem sayfasıyla,hem kayıtıyla hemde gadget iyle uyumlu olan bu kod çok işinize yarayacak. KOD

<!DOCTYPE html> <html lang="en"> <head>  <meta charset="utf-8">  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  <title>Nice Calculator</title>  <style>  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {   margin: 0;   padding: 0;   border: 0;   font-size: 100%;   font: inherit;   vertical-align: baseline; }  article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {   display: block; }  body {   line-height: 1; }  ol, ul {   list-style: none; }  blockquote, q {   quotes: none; }  blockquote:before, blockquote:after, q:before, q:after {   content: '';   content: none; }  table {   border-collapse: collapse;   border-spacing: 0; }  .about {   margin: 70px auto 40px;   padding: 8px;   width: 260px;   font: 10px/18px 'Lucida Grande', Arial, sans-serif;   color: #bbb;   text-align: center;   text-shadow: 0 -1px rgba(0, 0, 0, 0.3);   background: #383838;   background: rgba(34, 34, 34, 0.8);   border-radius: 4px;   background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));   background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));   background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));   background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));   -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4);   box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4); } .about a {   color: #eee;   text-decoration: none;   border-radius: 2px;   -webkit-transition: background 0.1s;   -moz-transition: background 0.1s;   -o-transition: background 0.1s;   transition: background 0.1s; } .about a:hover {   text-decoration: none;   background: #555;   background: rgba(255, 255, 255, 0.15); }  .about-links {   height: 30px; } .about-links > a {   float: left;   width: 50%;   line-height: 30px;   font-size: 12px; }  .about-author {   margin-top: 5px; } .about-author > a {   padding: 1px 3px;   margin: 0 -1px; }  /*  * Copyright (c) 2012-2013 Thibaut Courouble  * http://www.cssflow.com  *  * Licensed under the MIT License:  * http://www.opensource.org/licenses/mit-license.php  */ input, button {   -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;   box-sizing: border-box; }  ::-moz-focus-inner {   padding: 0;   border: 0; }  @font-face {   font-family: 'UbuntuMono';   font-style: normal;   font-weight: normal;   src: url(../fonts/UbuntuMono.woff) format("woff"); }  body {   font: 12px/20px 'Lucida Grande', Tahoma, Verdana, sans-serif;   color: #404040;   background: #d8e5e5; }  .calc {   margin: 50px auto;   padding: 15px;   width: 177px;   background: #3d4543;   border: 1px solid #222;   border-radius: 4px;   background-image: -webkit-linear-gradient(top, #3d4543, #2f2a2f);   background-image: -moz-linear-gradient(top, #3d4543, #2f2a2f);   background-image: -o-linear-gradient(top, #3d4543, #2f2a2f);   background-image: linear-gradient(to bottom, #3d4543, #2f2a2f);   -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 4px rgba(0, 0, 0, 0.5);   box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 4px rgba(0, 0, 0, 0.5); }  .calc-display {   margin: 0 0 20px;   padding: 3px;   background: #222;   border-radius: 3px;   -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.08);   box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.08); }  .calc-display-input {   display: block;   width: 100%;   height: 35px;   padding: 0 8px;   font: 26px/35px UbuntuMono, monospace;   color: #444;   text-align: right;   background: #bccd95;   background-clip: padding-box;   /* Don't let the background bleed outside the border */   border: 1px solid #222;   border-radius: 2px;   background-image: -webkit-linear-gradient(top, #bccd95, #e0f5b1);   background-image: -moz-linear-gradient(top, #bccd95, #e0f5b1);   background-image: -o-linear-gradient(top, #bccd95, #e0f5b1);   background-image: linear-gradient(to bottom, #bccd95, #e0f5b1);   -webkit-box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.12);   box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.12); }  .calc-row {   margin-top: 7px;   zoom: 1; } .calc-row:before, .calc-row:after {   content: '';   display: table; } .calc-row:after {   clear: both; }  .calc-button {   float: left;   padding: 0;   margin: 0 0 0 7px;   width: 39px;   font: 14px/23px UbuntuMono, monospace;   color: white;   text-align: center;   text-decoration: none;   text-shadow: 0 1px rgba(0, 0, 0, 0.4);   background: #313131;   background-clip: padding-box !important;   /* !important because FF overrides the value on :active */   border: 0;   /* IE 8 fix */   border: 1px solid rgba(0, 0, 0, 0.8);   border-radius: 3px;   cursor: pointer;   background-image: -webkit-linear-gradient(top, #313131, #1c1c1c);   background-image: -moz-linear-gradient(top, #313131, #1c1c1c);   background-image: -o-linear-gradient(top, #313131, #1c1c1c);   background-image: linear-gradient(to bottom, #313131, #1c1c1c);   -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.08);   box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 1px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.08); } .calc-button:first-child {   margin-left: 0; } .calc-button:active {   background: #282828;   -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.6), 0 1px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.05);   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.6), 0 1px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 255, 255, 0.05); }  .calc-button-gray {   background: #6f6f6f;   background-image: -webkit-linear-gradient(top, #6f6f6f, #515151);   background-image: -moz-linear-gradient(top, #6f6f6f, #515151);   background-image: -o-linear-gradient(top, #6f6f6f, #515151);   background-image: linear-gradient(to bottom, #6f6f6f, #515151); } .calc-button-gray:active {   background: #555; }  .calc-button-red {   background: #ff4561;   background-image: -webkit-linear-gradient(top, #ff7286, #ff4561);   background-image: -moz-linear-gradient(top, #ff7286, #ff4561);   background-image: -o-linear-gradient(top, #ff7286, #ff4561);   background-image: linear-gradient(to bottom, #ff7286, #ff4561); } .calc-button-red:active {   background: #ff4561; }  .calc-button-yellow {   background: #ffa70c;   background-image: -webkit-linear-gradient(top, #ffb935, #ffa70c);   background-image: -moz-linear-gradient(top, #ffb935, #ffa70c);   background-image: -o-linear-gradient(top, #ffb935, #ffa70c);   background-image: linear-gradient(to bottom, #ffb935, #ffa70c); } .calc-button-yellow:active {   background: #ffa70c; }  .calc-button-big {   font-size: 16px; }  .lt-ie8 .calc-display-input {   width: 152px; }  /* border-box fix */ .lt-ie7 .calc-row {   margin-left: -7px; }  /* first-child fix */    </style>  </head><body>  <form class="calc">    <p class="calc-display">      <input type="text" name="res" id="res" value="4815.1623" class="calc-display-input" onfocus="this.blur()">    </p>    <p class="calc-row">      <button type="button" class="calc-button calc-button-gray" onclick="s('Just....')">mrc</button>      <button type="button" class="calc-button calc-button-gray" onclick="s('....do..')">m-</button>      <button type="button" class="calc-button calc-button-gray" onclick="s('......it')">m+</button>      <button type="button" class="calc-button calc-button-red calc-button-big" onclick="a('/')">Ã·</button>    </p>    <p class="calc-row">      <button type="button" class="calc-button" onclick="a('7')">7</button>      <button type="button" class="calc-button" onclick="a('8')">8</button>      <button type="button" class="calc-button" onclick="a('9')">9</button>      <button type="button" class="calc-button calc-button-red calc-button-big" onclick="a('*')">x</button>    </p>    <p class="calc-row">      <button type="button" class="calc-button" onclick="a('4')">4</button>      <button type="button" class="calc-button" onclick="a('5')">5</button>      <button type="button" class="calc-button" onclick="a('6')">6</button>      <button type="button" class="calc-button calc-button-red calc-button-big" onclick="a('-')">-</button>    </p>    <p class="calc-row">      <button type="button" class="calc-button" onclick="a('1')">1</button>      <button type="button" class="calc-button" onclick="a('2')">2</button>      <button type="button" class="calc-button" onclick="a('3')">3</button>      <button type="button" class="calc-button calc-button-red calc-button-big" onclick="a('+')">+</button>    </p>    <p class="calc-row">      <button type="button" class="calc-button" onclick="a('0')">0</button>      <button type="button" class="calc-button" onclick="a('.')">.</button>      <button type="button" class="calc-button" onclick="s('')">C</button>      <button type="button" class="calc-button calc-button-yellow calc-button-big" onclick="e()">=</button>    </p>  </form>   <div  align="center">     <p >          </p>  </div>  <script>    function s(v) { document.getElementById('res').value = v }     function a(v) { document.getElementById('res').value += v }     function e() { try { s(eval(document.getElementById('res').value)) } catch(e) { s('Error') } }   </script></body></html><a target="_blank" href="http://www.htmlkodcanavari.blogspot.com" style="font-size: 6pt; text-decoration: none">Sitenize Çok güzel bir css ekleyin</a>

Pratibook

Sitenize Çok Güzel Bir Hesap Makinesi Ekleyin Kodu- HTML KOD CANAVARI

0 yorum:

Yorum Gönder