javascript ve style komut örnekleri

• style="cursor:url('resim/zoomin.cur'), default;"
• display:block;
• display:none;
• cursor:url('resim/tasi.cur'), default;
• height:31px;
• width:69px;
• text-decoration:none;
• text-shadow:0 1px 0 rgba(255,255,255,.5);
• border-bottom:1px solid #aaa;
• border-radius:2px 2px 0 0;
• a:hover, a:focus {opacity:.9;}
• padding:10px 15px;
• background:black;
• color:yellow;
• border-radius:5px;
• -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3);
• -moz-box-shadow:0 1px 3px rgba(0,0,0,.3);
• -o-box-shadow:0 1px 3px rgba(0,0,0,.3);
• box-shadow:0 1px 3px rgba(0,0,0,.3);
• overflow:hidden;
• -webkit-transition:height .4s ease-out, padding .4s ease-out;
• -moz-transition:height .4s ease-out, padding .4s ease-out;
• -o-transition:height .4s ease-out, padding .4s ease-out;
• -ms-transition:height .4s ease-out, padding .4s ease-out;
• transition:height .4s ease-out, padding .4s ease-out;
• padding:5em;
• padding-bottom:0;
• margin:10em;
• margin-left: 10px;
• margin-top: 10px;
• margin-right: 10px;
• margin-bottom: 10px;
• font:.8em/1.7 "Lucida Sans";
• font-weight:700;
• list-style:none;
• top:50%;
• left:50%;
• opacity:1;
• -webkit-transform:scale(1.03)
• -moz-transform:scale(1.03)
• font-size: 10px; /* harf boyutu
• position:absolute;
• position:fixed;
• a:link{color:Blue;} /* link rengi */
• a:hover{color:Red;} /* Fare üzerine geldiğinde aktif olur */
• a:active{color:Green;} /* yazıyı aktifte iken renklendirir */
• a{text-decoration:none;} /* Yazı altındaki çizgiyi kaldırır */
• z-index:9999; /* üstte olmak */
• opacity: 5.2;
• filter: alpha(opacity=300);/* For IE 8 & 9 (more valid) */
• background-color:#FFE4C9;
• margin:-170px 0 0 400px;
• -webkit-transition: 1.8s;
• -moz-transition: 1.8s;
• border-width: 5px;
• border-style: solid;
• position: relative; /* pozisyon konumu */
• left: 50px; /* sola doğru 50px */
• H1{background-color:blue;} /* Arka alan rengi */
• text-indent:250px; /* yazıyı kaydırma */
• a.tooltip {outline:none; } /* hat çıkışı kapalı */
• a.tooltip strong {line-height:30px;}
• a.tooltip span
• line-height:16px; /* hat yüksekliği */
• H2{text-align:center;}
• -webkit-transition: all 0.75s ease;
• display: inline-block;
• -webkit-tap-highlight-color: transparent;
• padding: 1.2em .8em;
• section {max-width: 450px; margin: 0 auto; padding: 3em 0;}
• section + section {border-top: 1px solid #ddd;} /* alan kenarlık */
• img {vertical-align:middle;} /* resim dikey orta */
• list-style:none; /* Listeleme kapalı */
• -webkit-transition:opacity .2s linear; /* düşük hız saydam */
• @-webkit-keyframes supersize {0% { -webkit-transform:scale(.9); }100% { -webkit-transform:scale(1); }}
• overflow:hidden; /* Alan dışına taşmadı */
• -webkit-transition:opacity 1.2s cubic-bezier(0,0,0,1);
• li[id] a:before {content:url(close.gif);
• li[id] a:hover:before {opacity:1; content:url(zoomout.cur);}
• li[id]:target {width:100%; height:100%; opacity:1;} /* kaynak genişlik yükseklik saydam */
• div#myDiv {-ms-transform: rotate(20deg);} /* IE 9 */
• div#myDiv {-webkit-transform: rotate(20deg);} /* Safari açılı döndürme */
• div#myDiv {transform: rotate(40deg);} /* Standard syntax */
• #toool, img{width:50px;} /* img resim boyutu */
• div img{width:150px;} /* img resim boyutu */
• input:hover, select:hover {background:yellow;} /* iki object çalışır */
• onMouseDown="document.bgColor='yellow'
• oninput="resimci()" yazarken hemen günceller
• input type="text" id="resimci" placeholder="Resim dosyası adı yazın" oninput="resimci()"
• input:focus {background-color: yellow;}
• border-image-slice: 30;
• background-color: linen;
• text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF;
• text-shadow: 20px 20px #FF0000;
• document.getElementById("myDIV").classList.remove("mystyle");
• document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");
• document.getElementById("myDIV").classList.add("mystyle");// css ve js ortak köprü //
• onmouseover="myFunction()" onmouseout="myFunction2()"
• document.body.style.backgroundSize = "1200px"; // arka plan boyut //
• document.body.style.backgroundRepeat = "no-repeat"; // arka plan tek resim//
• document.body.style.backgroundImage = "url('resim/sinasi.jpg')"; // JS//
• (-webkit-filter:grayscale(" + value*1 + "%)") // siyah beyaz //
• ("style","-webkit-filter:grayscale(" + value*1 + "%)")
• filter:sepia(100%);
• filter:saturate(8);
• filter:opacity(30%); // saydam yapma //
• filter:invert(100%); // negatif resim //
• filter:hue-rotate(90deg); // dereceli resim //
• filter:drop-shadow(8px 8px 10px red);// gölgeli //
• filter:blur(5px); // bulanık resim //
• filter:brightness(200%) // parlaklık verme //
• filter:contrast(200%); // kontrast resim //
• background-repeat: no-repeat;
• background-attachment: fixed; // ekleme //
• text-transform: capitalize; // Baş Harf büyük CSS //
• text-transform: lowercase;// küçük harf CSS //
• text-transform: uppercase; // büyük harf CSS //
• -webkit-animation-delay: 2s; // ağır //
• window.open("http://www.elektrosin.com/", "", "width=300, height=300"); // popup pencerede link açar JS //
• document.body.style.backgroundColor = "yellow"; // JS//
• document.body.innerHTML = "makale yaz " // script içine yazı yazılabilir JS//
• body.style.backgroundColor = "blue" // Arka plan renk kısa kod JS//
• document.getElementsByTagName('textarea')[0].style.backgroundColor = '#'+this.color
• document.getElementsByTagName("H1")[0].setAttribute("class", "class1"); // css ile script ortak //
• document.getElementsByTagName('img')[0].style.width = 20*x + "px"; // TagName ile resim boyutu JS//
• document.getElementById("rota_resim").style.width = 20*x + "px"; // Etiket ile resim boyutu JS//
• var x = document.getElementById("myRange5").value;
• document.getElementById("resim_adeti").innerHTML = "Number of images: " + document.images.length;
• document.getElementById('myBtn').style.cursor = 'url("resim/zoomin.cur"), auto';
• document.getElementById("gun").innerHTML = "Today is " + day;
• var x = document.getElementById("resimMy").value;
• document.getElementById("myResim").src = "resim/"+ x +".jpg";
• document.title='Şinasi Yavuz';
• onclick="document.getElementById('titleResim').href = 'resim/sexy7ab.png' ;"
• document.getElementById("cumlem").innerHTML ="Selam Aleyküm";
• document.getElementById("lokal").innerHTML = "Sayfamın konumu: " + window.location.href;
• document.getElementById("harf_adeti").innerHTML = "Harf Adeti: " + txt.length;
• location.href = "http://www.elektrosin.com";
• var str = "Şinasi Yavuz"; var res = str.toUpperCase(); document.getElementById("harfci").innerHTML = res;
• var str = mini_yazi.value; var res = str.toUpperCase(); document.getElementById("harfci").innerHTML = res;
• document.getElementById("ko0").setAttribute("class", "class1");
• document.getElementById("divID").setAttribute("style","-webkit-filter:grayscale(" + value + "%)")
• document.addEventListener("click", function(){document.body.style.backgroundColor = "red";});
• document.querySelector(".example").style.backgroundColor = "red";
• document.querySelector("p").style.backgroundColor = "red";
• document.getElementById("myP").style.visibility = "hidden";
• document.getElementById("myImg").style.visibility = "visible";
• document.getElementById("myP1").style.display = "none";
• e.style.fontSize = '55px';
• if(e.style.color == 'blue')
• e.style.color = 'yellow';
• var e = document.getElementById(id);
• ("style","-webkit-transform:translateX(" + value*17 + "px)")
• ("style","-webkit-transform: rotate(" + value*4 + "deg)")
• document.getElementById("divID").setAttribute("style","-webkit-transform: rotate(" + value*4 + "deg)")
• function changegrayscale(value)
• ("style","-webkit-transform:translateY(" + value*17 + "px)")
• transform:scale(0.5,2);
• background-position:center center;
• Arka FON Resimli | background-image:url('uzay_fon.gif');
• background-repeat:no-repeat;
• background-position:50% 50%;
• font-variant: small-caps;
• align-self: center;
• location.reload();
• onload="brightness('25'); invert('0'); bulur('0'); kontrast('50'); gri('0'); cevir(0);
• placeholder="buradan arayın"
• input type="text" name="usrname" maxlength="10" Harf kısıtlaması en fazla HTML
• input onchange="myFont()" type="range" id="myRange_yazi" value="" min="10" max="30" step="3"

• Yazıyı Tıkla!

• onclick="this.style.backgroundColor='green'"
• link id="iconYaz" rel="icon" href="resim/girl.png" type="image/png"
• background-position:50% 50%; resim konum CSS
• document.body.style.backgroundPosition="top right";
• document.getElementById('yaz').setAttribute("style","color:blue");
• input type=range thumb value
• text-align:center;
• clear:both;
• var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
• if (new Date().getHours() < 18) {----}
• document.getElementById("harf_adeti").innerHTML = txt.length + " Adet Karakter";
• textarea cols="90px" rows="20px"
• onclick="document.getElementById('seri').innerHTML = s ; "
• onclick="setTimeout(seriFunc, 3000);"
• var x = document.getElementsByTagName("p");
• document.getElementById("myForm").target = "_blank";
• textarea#test {resize: none;}
• onmousedown="classList.add('mystyle');"
• location.pathname
• auto crosshair default e-resize grab help move n-resize ne-resize nw-resize pointer progress s-resize se-resize sw-resize text w-resize wait not-allowed no-drop
• document.getElementById("myDiv").style.border = "thick solid #0000FF";
• background-image :url('resim/note3.png');
• background-size :20px;
• background-repeat: no-repeat;
• document.body.style.backgroundImage = "url('resim/simit_fon.gif')";
• document.body.style.backgroundRepeat = "no-repeat";
• document.body.style.backgroundSize = "1300px 900px";
• x = document.getElementById("sesVar").value ;
• document.getElementById("sesCal").src = "ses/" + x + ".wav";
• document.getElementById('sesCal').play();
• link id="iconYaz" rel="icon" href="resim/note3.png" type="image/png"
• script type="text/javascript" src="js/beep.js" language="javascript"
• audio id="sesCal" src="ses/beep04.wav" preload="auto"
• input:focus
• background-image :url('resim/note3.png'); background-size :20px; background-repeat: no-repeat;
• input id="arkaFon" type="color" dat="fonRengi" name="favcolor" value="#ff0000" oninput="renkFunc()"
• transition-property: background;
• transition-timing-function: linear;
• transition-duration: 1s;
• font-weight :bold;
• x = x - 1; if(x < 0){x = 0;}
• font-style: oblique;
• font-style: italic;
• height: 20px; background: -webkit-linear-gradient(green,yellow,blue);
• height: 20px; background: -webkit-linear-gradient(left, red , blue);
• var str = "şinasi yavuz"; document.getElementById("demo").innerHTML = str.slice(6,12);
• str.slice(5);
• str.substr(7,6);
• var x = 1; Boolean(x == 1); sonuç: true
• var x = 0; Boolean(x = 0); sonuç: false