Sổ tay code blogspot phần 3

1 Phút Dành Cho Quảng Cáo

<b>

  <script>

  var text="NỘI DUNG ĐOẠN VĂN BẢN BẠN ĐẶT VÀO ĐÂY, SAU DẤU NGOẶC KÉP"

  var speed=40

  if (document.all||document.getElementById){

  document.write('<span id="highlight">' + text + '</span>')

  var storetext=document.getElementById? document.getElementById("highlight") : document.all.highlight

  }

  else

  document.write(text)

  var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

  var r=1

  var g=1

  var b=1

  var seq=1

  function changetext(){

  rainbow="#"+hex[r]+hex[g]+hex[b]

  storetext.style.color=rainbow

  }

  function change(){

  if (seq==6){

  b--

  if (b==0)

  seq=1

  }

  if (seq==5){

  r++

  if (r==12)

  seq=6

  }

  if (seq==4){

  g--

  if (g==0)

  seq=5

  }

  if (seq==3){

  b++

  if (b==12)

  seq=4

  }

  if (seq==2){

  r--

  if (r==0)

  seq=3

  }

  if (seq==1){

  g++

  if (g==12)

  seq=2

  }

  changetext()

  }

  function starteffect(){

  if (document.all||document.getElementById)

  flash=setInterval("change()",speed)

  }

  starteffect()

  </script>

  </b>

2. Code nổi bật văn bản :


<style>

.info { background: url("https://lh6.googleusercontent.com/-n-6-VR6mWZs/UtowKWOG0zI/AAAAAAAAWos/OZIHses1HiA/s346/information.png") no-repeat scroll 15px 50% #F8FAFC; border-bottom: 2px solid #B5D4FE; border-top: 2px solid #B5D4FE; padding: 5px 20px 5px 45px; } 

</style>

<div class="info">

Đoạn văn muốn nổi bật</div>

3.Đánh dấu (Bookmark) đến một vị trí nhanh trong bài viết :



<a href="LINK_bài_viết#Tên_gán_cho_vị_trí ">Nội_dung</a><br/>

<a name="Tên_gán_cho_vị_trí ">Nội_dung</a>

4. Tùy chỉnh đám mây nhãn 1 :(code này chèn sau thẻ <head> )


<style>  .label-size{       display: inline-block;       padding: 0px 10px;       height: 29px;       line-height:29px;       border-radius: 5px;       font-weight:bold;       font-size:12px;       text-decoration:none;    }      .label-size{      border: 1px solid #769e42;      box-shadow: inset 0 1px 0 #c5e59c ;      background-color: #9ed35a;      text-shadow: 0px 1px 1px #6ea23b;      color: #fff;      background-image: linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -o-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -moz-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -webkit-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -ms-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    }      .label-size:hover{      background-color: #b7fa66;      background-image: linear-gradient(top, #b7fa66 0%, #7ec940 100%);      background-image: -o-linear-gradient(top, #b7fa66 0%, #7ec940 100%);      background-image: -moz-linear-gradient(top, #b7fa66 0%, #7ec940 100%);      background-image: -webkit-linear-gradient(top, #b7fa66 0%, #7ec940 100%);      background-image: -ms-linear-gradient(top, #b7fa66 0%, #7ec940 100%);  }      .label-size:active{      background-image: linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -o-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -moz-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -webkit-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -ms-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    }      .label-size{      display:inline-block;      border-radius: 5px 0 0 5px;      border-right-width:0;      position:relative;      z-index:5;      margin-right: 20px;      margin-bottom: 10px;    }      .label-size:after{      content: " ";      width: 22px;      height: 22px;      line-height: 18px;      font-size:25px;      border-top: 1px solid #769e42;      border-right: 1px solid #769e42;      box-shadow: inset 0 1px 0 #c5e59c ;      background-color: #9ed35a;      text-shadow: 0px 1px 1px #7eac46;      border-radius: 3px 7px 3px 0;      color: #fff;      background-image: linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -o-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -moz-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -webkit-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -ms-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    position:absolute;    top: 3px;    right: -12px;    z-index:-3;    -webkit-transform: rotate(45deg);  /* Saf3.1+, Chrome */         -moz-transform: rotate(45deg);  /* FF3.5+ */          -ms-transform: rotate(45deg);  /* IE9 */           -o-transform: rotate(45deg);  /* Opera 10.5 */              transform: rotate(45deg);                 filter: progid:DXImageTransform.Microsoft.Matrix(/* IE6–IE9 */                         M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476, sizingMethod='auto expand');                   zoom: 1;  }      .label-size:hover:after{      background-color: #b7fa66;      background-image: linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);      background-image: -o-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);      background-image: -moz-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);      background-image: -webkit-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);    background-image: -ms-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);  }      .label-size:active:after{      background-image: linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -o-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -moz-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -webkit-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);    background-image: -ms-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);  }    .label-size:before{      content: " ";      height:5px;      width:5px;      display:block;      position:absolute;      right:-3px;      top:11px;      background-color: #fcfdf5;      border: 1px solid #83ab52;      border-radius:5px;      box-shadow: 0 1px 0 #b2ddd83;    }      .label-size span{      padding:2px 5px;      border: 1px solid #9e5c26;      border-radius: 5px;      box-shadow: inset 0 1px 0 #f5bf8c;      background-color: #ed943f;      text-shadow: 0px 1px 1px #000;      margin-left: 10px;      background-image: linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);    background-image: -o-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);    background-image: -moz-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);    background-image: -webkit-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);    background-image: -ms-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);  }      #Label1 {height:210px !important;}  
</style>

* Chú ý dòng cuối

#Label1 {<strong>height:210px</strong> !important;}

* Số 210 là chiều cao của nhãn bạn tùy chỉnh lại cho phù hợp
4. Menu cuối trang
Code 1 :


<!-- Tieu de tren --> <div style= "position: fixed; bottom: 0px; left: 0px; width: 100%; z-index: 49999; height: 30px; background-image: url('http://i1176.photobucket.com/albums/x335/quangthu05/Anh%20cho%20blog/topbar_bg.png'); background-position: center center; background-repeat: no-repeat; text-align: center;"> <div style="width: 85%; height: 25px;"> <table cellspacing="0" cellpadding="0" border="0" width="100%"> <tbody> <tr> <td height="25px" align="center" style= "color: rgb(255, 255, 255); font-size: 9pt;"><span style= "width: 150px; padding-right: 50px; color: rgb(5, 255, 25); font-size: 11pt; font-family: 'Arial'; letter-spacing: -1px;"> <a style="color: rgb(5, 255, 25);" title= "Click vào đây để đăng nhập hoặc đăng kí thành viên ngay bây giờ" href="http://7kho.violet.vn/block/join"><font face= "Arial, Helvetica, sans-serif"><strong>7Kho</strong></font></a></span> <font face="Arial, Helvetica, sans-serif"><span style= "padding-left: 3px; padding-right: 3px; text-decoration:none"><a style="color: rgb(5, 255, 25);" title="Chia sẻ kinh nghiệm dạy và học Toán" href= "http://7kho.violet.vn/entry/list/cat_id/2174668">Chuyên môn Toán</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title= "Chia sẻ kinh nghiệm dạy và học Vật lý" href= "http://7kho.violet.vn/entry/list/cat_id/2671286">Chuyên môn V.Lý</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title= "Bồi dưỡng nghiệp vụ sư phạm" href= "http://7kho.violet.vn/entry/list/cat_id/2174669">Nghiệp vụ sư phạm</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title="Ebooks" href= "http://7kho.violet.vn/entry/list/cat_id/2671266">Ebooks</a></span> | <span style="padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title="Phần mềm" href= "http://7kho.violet.vn/entry/list/cat_id/2174670">Phần mềm</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title="Bí quyết làm đẹp" target= "_blank" href= "http://violet.vn/hongtiem/entry/list/cat_id/3944124">Làm đẹp</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title= "Chuyên mục thời trang công sở" target="_blank" href= "http://violet.vn/hongtiem/entry/list/cat_id/3944497">Thời trang công sở</a></span> | <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title="Nghệ thuật sống" target= "_blank" href= "http://violet.vn/hongtiem/entry/list/cat_id/3953472">Nghệ thuật sống</a></span>| <span style= "padding-left: 3px; padding-right: 3px;"><a style= "color: rgb(5, 255, 25);" title="Kinh nghiệm chủ nhiệm" target="_blank" href= "http://violet.vn/ptcs-nammuoi-yenbai/entry/list/cat_id/3999400">Chủ nhiệm</a></span></font></td> </tr> </tbody> </table> </div> </div>

Code 2 :


<div style="position: fixed; width: 100%; height: 25px; z-index: 0;   left: 0pt; bottom: 0pt; border-top: 1px solid rgb(192, 192, 192); ;   padding: 2px 70px; background-color: rgb(243, 243, 243); font-family:   tahoma; font-size: 10pt; font-weight: normal;" id="itlagi-Toolbar">

| <a href="http://bangvu.net" rel="follow" rel="nofollow" target="_blank">Diễn đàn</a> |

<a href="http://bangvu.net/phim" rel="follow" rel="nofollow" target="_blank">Xem phim</a> |

<a href="http://bangvu.net/music" rel="follow" rel="nofollow" target="_blank">Nghe nhạc</a> |

<a href="http://bangvu.net/nhatui" rel="follow" rel="nofollow" target="_blank">Game Flash</a> |

<a href="http://bangvu.net/down4you" rel="follow" rel="nofollow" target="_blank">Down4you</a> |

<a href="http://bangvu.net/violet/encoder.htm" rel="follow" rel="nofollow" target="_blank">Mã hóa CODE</a> |

</div>

5. Tạo menu cố định :
- Code 1 :

<style>

  #fixNav{

  width: 100%;

  height: 35px;

  background-color: #265325;

  display: block;

  box-shadow: 0px 2px 2px rgba(0,0,0,0.5); /*Đổ bóng cho menu*/

  position: fixed; /*Cho menu cố định 1 vị trí với top và left*/

  top: 0; /*Nằm trên cùng*/

  left: 0; /*Nằm sát bên trái*/

  z-index: 100000; /*Hiển thị lớp trên cùng*/

  }

  #fixNav ul{

  margin: 0;

  padding: 0;

  }

  #fixNav ul li{

  list-style:none inside;

  width: auto;

  float: left;

  line-height: 35px; /*Cho text canh giữa menu*/

  color: #fff;

  padding: 0;

  margin-right:10px;

  position: relative;

  }

  #fixNav ul li a{

  text-transform: uppercase;

  white-space: nowrap; /*Cho chữ trong menu không bị wrap*/

  padding: 0 10px;

  color: #fff;

  display: block;

  font-size: 0.8em;

  text-decoration: none;

  }

  /*CSS Style cho Submenu*/

  #fixNav ul li ul {

  position: absolute;

  width: auto;

  display: none;

  background-color: #252525;

  border-bottom: 3px solid #0082bb;

  padding-left: 5px;

  }

  

  #fixNav ul li ul li{

  display: block;

  padding:0;

  margin: 0;

  float: none; /*Bỏ float cho li cấp thứ 2*/

  }

  /* Hover cho submenu */

  #fixNav ul li:hover {

  /* Hover thì li sẽ đổi màu*/

  background-color: #252525;

  }

  #fixNav ul li:hover ul{

  /*Display ra submenu*/

  display: block;

  }

  /*Không copy cái này, dùng tăng padding top bottom để demo cuộn*/

  p{

  padding-top: 80px;

  padding-bottom: 80px;

  }

  </style>


<nav id="fixNav">

  <ul>

  <li><a href="#">Trang chủ</a></li>

  <li><a href="#">HTML</a></li>

  <li><a href="#">CSS</a></li>

  <li><a href="#">JavaScript</a></li>

  <li>

  <a href="#">Khác</a>

  <ul class="sub-menu">

  <li><a href="#">Html & CSS</a></li>

  <li><a href="#">PHP & MySQL</a></li>

  <li><a href="#">jQuery</a></li>

  </ul>

  </li>

  </ul>

  </nav>

6. Tạo thông báo nhiều màu :

<style>


/* CSS Note by Indzign */

  .note{position:relative;width:30%;padding:1.2em 1.5em;margin:2em auto;color:#fff;background:#2ecc71;overflow:hidden}

  .note.orange{background:#f39c12}

  .note.red{background:#F2784B}

  .note.blue{background:#3498db}

  .note:before{content:"";position:absolute;top:0;right:0;border-width:0   16px 16px 0;border-style:solid;border-color:#fff #fff #27ae60   #27ae60;background:#27ae60;box-shadow:0 1px 1px rgba(0,0,0,0.3),-1px 1px   1px rgba(0,0,0,0.2);display:block;width:0}

  .note.orange:before{border-color:#fff #fff #e67e22 #e67e22;background:#e67e22}

  .note.crusta:before{border-color:#fff #fff #de6e45 #de6e45;background:#de6e45}

.note.river:before{border-color:#fff #fff #2980b9 #2980b9;background:#2980b9}


</style>

Sau đó chèn code thông báo vào vị trí cần hiển thị :
1. Thông báo đơn giản :


<div class='note'>...TYPE YOUR NOTE HERE...</div>

2. Thông báo màu da cam :


<div class='note orange'>...TYPE YOUR NOTE HERE...</div>

3. Thông báo màu xanh :


<div class='note blue'>...TYPE YOUR NOTE HERE...</div>

4. Thông báo màu đỏ :


<div class='note red'>...TYPE YOUR NOTE HERE...</div>

7. Tạo khung bao xung quanh link :

<style>

  .btn{font-weight:400;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out;border-radius:0}.btn-default{border:1px solid #42DCA3;color:#42DCA3;background-color:transparent}.btn-default:focus,.btn-default:hover{border:1px solid #42DCA3;outline:0;color:#000;background-color:#42DCA3}

  </style>


<a class='btn btn-default btn-lg' href='http://www.goghep.info/2017/03/go-nguyen-lieu.html'> 123</a>

8. Tạo chữ chạy màu :



  <style>

  .neonlight{font-weight:bold;

  font-family:times;

  font-size:20px; /*cở chữ*/

  }

  </style>


<script language="JavaScript1.2">

  var message="Web Mẫu Vải Nhám, Giấy Nhám" //thay thành dòng tin của bạn

  var neonbasecolor="#000099" //màu của text

  var neontextcolor="#FFFC17" //màu của hiệu ứng neon 1

  var neontextcolor2="#FBB117" //màu của hiệu ứng neon 2

  var flashspeed=120 // tốc độ chạy của màu neon 1 và neon 2, số càng nhỏ tốc độ càng nhanh

  var flashingletters=2 // độ rộng của màu neon 1

  var flashingletters2=1 // độ rộng của màu neon 2

  var flashpause=0


var n=0

  if (document.all||document.getElementById){

  document.write('<font color="'+neonbasecolor+'">')

  for (m=0;m<message.length;m++)

  document.write('<span class="neonlight" id="neonlight'+m+'">'+message.charAt(m)+'</span>')

  document.write('</font>')

  }

  else

  document.write(message)


function crossref(number){

  var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)

  return crossobj

  }

  function neon(){

  if (n==0){

  for (m=0;m<message.length;m++)

  crossref(m).style.color=neonbasecolor

  }

  crossref(n).style.color=neontextcolor


if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2

  if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor


if (n<message.length-1)

  n++

  else{

  n=0

  clearInterval(flashing)

  setTimeout("beginneon()",flashpause)

  return

  }}

  function beginneon(){

  if (document.all||document.getElementById)

  flashing=setInterval("neon()",flashspeed)

  }

  beginneon()


</script>

Sổ tay code blogspot phần 3

Đăng nhận xét

0 Nhận xét

Bài đăng nổi bật

Thớt Tròn gỗ Beech & Walnut có tay cầm ST-ND9

Đẹp,độc, lạ

Bán chạy

Facebook

POPULAR POSTS

Bộ đồ chơi nhà bếp, dụng cụ nấu ăn bằng Inox-Kid Can Cook ST-HsK

Giàn phơi nhựa ABS - inox đôi ST-mvv

Kẹp gỗ Đa Năng ST-S29

ADS

Khay gỗ

Đũa gỗ

Chày cối gỗ

Recent

Dụng cụ bếp

HOT TAG

SHOP ONLINE

RANDOM POSTS

POPULAR POSTS

Bộ chén đĩa sứ MÂY & GIÓ phong cách Nhật Bản ST-AHZ

Đũa tre sạch tiệt trùng dùng 1 lần ST-QUU

Khay gỗ lục giác, vuông, tròn, chữ nhật ST-7BG

Menu Footer Widget

Biểu mẫu liên hệ

An tâm mua sắm tại nhà - giao hàng tận nơi - chẳng lo về giá

Sổ tay code blogspot phần 3

Bạn có thể thích những bài đăng này

Đăng nhận xét

0 Nhận xét

Social Icons

Bài đăng nổi bật

Thớt Tròn gỗ Beech & Walnut có tay cầm ST-ND9

Đẹp,độc, lạ

Bán chạy

Facebook

POPULAR POSTS

Bộ đồ chơi nhà bếp, dụng cụ nấu ăn bằng Inox-Kid Can Cook ST-HsK

Giàn phơi nhựa ABS - inox đôi ST-mvv

Kẹp gỗ Đa Năng ST-S29

ADS

Khay gỗ

Đũa gỗ

Chày cối gỗ

Recent

Dụng cụ bếp

HOT TAG

SHOP ONLINE

RANDOM POSTS

POPULAR POSTS

Bộ chén đĩa sứ MÂY & GIÓ phong cách Nhật Bản ST-AHZ

Đũa tre sạch tiệt trùng dùng 1 lần ST-QUU

Khay gỗ lục giác, vuông, tròn, chữ nhật ST-7BG

Menu Footer Widget

Biểu mẫu liên hệ

An tâm mua sắm tại nhà - giao hàng tận nơi - chẳng lo về giá