Code Blog Tong Hop

Khi viết blog bạn phải cần một số code thông dụng,vừa để trang trí blog đẹp hơn,vừa có kiến thức về ngôn ngữ lập trình HTML.Bài post sau đây sẽ cung cấp các code blog cần thiết cho bạn

One Dream Family_Luôn thay đổi để hoàn thiện hơn

TỔNG HỢP CODE BLOG

Bạn vào Bố cục=>> thêm tiện ích=>>HTML/JavaScript rồi dán code bên dưới vào (nhớ là tìm chỗ nào có địa chỉ eselego.blogspot.com thì thay bằng địa chỉ blog của bạn nhé)

1.Hiệu ứng tuyết rơi

position: fixed;

height: 1500px;

width: 100%;

max-width: 100%;

top: 0;

overflow: hidden;

z-index: 2;

pointer-events: none;

}

.snow {

display: block;

position: absolute;

z-index: 2;

top: 0;

right: 0;

bottom: 0;

left: 0;

pointer-events: none;

-webkit-transform: translate3d(0, -100%, 0);

transform: translate3d(0, -100%, 0);

-webkit-animation: snow linear infinite;

animation: snow linear infinite;

}

.snow.foreground {

background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPY8x_PAE347icvvg7yKWHTRhszUcse5dEsR_i2PHw5LMfrotW-fHTYPuMju387HGRUHaG6LHz6QGw6Upj88VR-3Vt9m0Ps9Gd3_qJGOX5dUkB-dVkUJ_gfJ2TCSGHab5OntdVOM_ewxo/s1600/snow-large-dtc.png");

-webkit-animation-duration: 15s;

animation-duration: 15s;

}

.snow.foreground.layered {

-webkit-animation-delay: 7.5s;

animation-delay: 7.5s;

}

.snow.middleground {

background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhF8kmbMMbxmpZY4rdWmsKG2skind59UdPIxp4kXQQSzQQrrz49wAPmaDN6I_naMxw-GQ9TryD0rTHyPOmxr4Zlq3LK2L1C8UrZ9ZT11qv7T2SKf6iMzXFxsN9TtQf-rK0EIdP7W2hwS2s/s1600/snow-medium-dtc.png);

-webkit-animation-duration: 20s;

animation-duration: 20s;

}

.snow.middleground.layered {

-webkit-animation-delay: 10s;

animation-delay: 10s;

}

.snow.background {

background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3H5hsNjFQ3Tj_2ZKdsVsftuZnf29hD7pwIjdjfVIsaJO3k4Zp5qmJT5pDnYajU9F7gr1mhONw7v9OupMif5gGClYDenW_zvfjgPxLx2bVQytdSUmsXUSYd3y6NJ3L-f4ziPc1R-hDIlM/s1600/snow-small-dtc.png);

-webkit-animation-duration: 25s;

animation-duration: 25s;

}

.snow.background.layered {

-webkit-animation-delay: 12.5s;

animation-delay: 12.5s;

}

@-webkit-keyframes snow {

0% {

-webkit-transform: translate3d(0, -100%, 0);

transform: translate3d(0, -100%, 0);

}

100% {

-webkit-transform: translate3d(5%, 100%, 0);

transform: translate3d(5%, 100%, 0);

}

@keyframes snow {

0% {

-webkit-transform: translate3d(0, -100%, 0);

transform: translate3d(0, -100%, 0);

}

100% {

-webkit-transform: translate3d(5%, 100%, 0);

transform: translate3d(5%, 100%, 0);

}

</style>

2.Thay đổi con trỏ chuột cho blog

<style>

HTML,BODY{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR-fO1SshV5pBexAIuHEigpZ2dkl3GMjjvk-Dm2xOSWoylhQ3zHOc4DJfxwzxDgHIqrjA2s9t5rrZrsrWJ2po9YmQYUXB9-tqGTzqg5zhKOnC3HDXFTNypay-KfKlq7X57wOMaPqlDWmA/s1600/acespades.gif"), auto;}

</style></div>

<style>

A:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJN-SqbFIga4nLiVWdAancQgRiJM8pG7vnLwc_As3U6zG_7RTft7A1yinxVIM2VLf9U9gMDYVsSQCCN4xLfGtakbMcmK_3gfkKaJRighYFJvzAy2B_ur9a8GQKE9Zm-fRLoswPjSowg1k/s1600/acehearts.gif"), auto;}

</style>

3.Tạo khung tìm kiếm cho blog

<form id="abt-css3-search" action="/search" method="get">
<input id="search" name="q" type="text" placeholder="Tìm Kiếm Tại Đây" />
<input id="submit" type="submit" value="Search" />
</form>
<p style="display:none;">Search Box by <a href="http://www.eselego.blogspot.com/">Thủ thuật blogspot</a></p>
<style>
#abt-css3-search{background:#eaf8fc;background-image:0;-moz-border-radius:35px;border-radius:35px;width:270px;height:35px;overflow:hidden;border-color:#c4d9df #a4c3ca #83afb7;border-style:solid;border-width:1px;padding:10px}
#search,#submit{float:left}
#search{height:23px;width:180px;border:1px solid #a4c3ca;font:normal 13px 'trebuchet MS', arial, helvetica;background:#f1f1f1;-moz-border-radius:50px 3px 3px 50px;border-radius:50px 3px 3px 50px;-moz-box-shadow:0 1px 3px rgba(0,0,0,0.25) inset, 0 1px 0 rgba(255,255,255,1);-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.25) inset, 0 1px 0 rgba(255,255,255,1);box-shadow:0 1px 3px rgba(0,0,0,0.25) inset, 0 1px 0 rgba(255,255,255,1);padding:5px 9px}
#submit{background:#6cbb6b;background-image:0;-moz-border-radius:3px 50px 50px 3px;border-radius:3px 50px 50px 3px;-moz-box-shadow:0 0 1px rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.3) inset;-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.3) inset;box-shadow:0 0 1px rgba(0,0,0,0.3), 0 1px 0 rgba(255,255,255,0.3) inset;height:35px;width:60px;cursor:pointer;font:bold 14px Arial, Helvetica;color:#23441e;text-shadow:0 1px 0 rgba(255,255,255,0.5);border-color:#7eba7c #578e57 #447d43;border-style:solid;border-width:1px;margin:0 0 0 10px;padding:0}
#submit:hover{background:#95d788;background-image:0}
#submit:active{background:#95d788;outline:none;-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset}
#submit::-moz-focus-inner{border:none}
#search.placeholder{color:#9c9c9c!important;font-style:italic}
#search:focus{background:#fff;outline:none;border-color:#8badb4}
#search::-webkit-input-placeholder,#search:-moz-placeholder{color:#9c9c9c;font-style:italic}
</style>

4.Code tạo đồng hồ và lịch

5.Tạo menu truy cập online:

6.Code Chữ Chạy Ngang Có Màu Nền:

<marquee behavior="scroll" bgcolor="#4CC552" direction="left" onmouseout="this.start();" onmouseover="this.stop();" scrollamount="6"> <span style="color: rgb(#ffffff,#00FF00, 0); font-size: 150%; font-weight: bold;">Cám ơn các bạn ghé tham quan và ủng hộ <a href="http://eselego.blogspot.com/">eselego.blogspot.com.</a>...Hãy chia sẽ blog này cho bạn bè nhé!...Nếu có thắc mắc xin gửi mail về quocquan37353@gmail.com mình sẽ trả lời cho bạn.</span>
</marquee>

7.Slide bài đăng cho blog: