Thứ Ba, 10 tháng 4, 2018

Hôm Nay Mình Xin Chia Sẽ Thanh Menu Top Mình Đang Dùng đã responsive Cực Đẹp
Bước 1. Bạn Chỉ Cần Chèn Đoạn Code này Vào Chỗ Bạn Muốn Đặt Là Được
<style>
.wrap_pluskienthuc_menu {background:linear-gradient(50deg,#55579e 0%,#474988 35%,#55579e 0%,#55579e 30%,#55579e 100%);padding:0;width: 100%; z-index:10;-webkit-user-select: none;-moz-user-select:none;-o-user-select:none;transition:1s}
  .menu_ngang {width:1080px; margin:0 auto}
  .logo_menungang {display:inline-flex;align-items:center;height:50px;padding:5px 0}
  .logo_menungang span {padding: 11px 25px; margin: 0 10px 0 0; background: rgba(0,0,0,.12);transition:.5s}
  .logo_menungang span:hover {background-color:rgba(0,0,0,.25)}
  .logo_menungang a {color: #fff; font-size: 30px; font-weight: 700; letter-spacing: 0; text-transform: uppercase; font-family: &quot;Roboto Condensed&quot;,sans-serif}
  .search_menungang {display:inline}
  .chuyenmuc_menungang {float:none;clear:both;display:inline}
  .chuyenmucmenungang {display: inline; height: 50px; position: relative; top: -3px; left: 42px}
  .chuyenmucmenungang li {list-style:none;display:inline;text-align:center}
  .chuyenmucmenungang a{color: #fff; text-decoration: none; font-size: 18px; transition: .3s; padding: 5px 15px;border:2px solid transparent;border-radius:0;font-family:&quot;Roboto Condensed&quot;,sans-serif;margin: 0; text-transform: uppercase; font-weight: 700; letter-spacing:0}
  .chuyenmucmenungang a:hover{color:white;border:2px solid;border-radius:50px}
  .chuyenmucmenungang a:focus{color:#55579e;background:#FFF;border:2px solid white;border-radius:50px}
@media screen and (max-width:1200px){
  .logo_wrap_pluskienthuc_menu{margin-left:0}
  .logo_wrap_pluskienthuc_menu span{visibility:hidden;margin:0!important}
  .wrap_pluskienthuc_menu{background:#7174a2!important}
      #pluskienthuc-popup-vt{display:none!important}
      .logo_menungang a{font-size: 25px;}
      .menu_ngang{width:68%!important}
.chuyenmuc_menungang{display:none!important}
.search_menungang{display:none!important}
}
</style>
<div class='wrap_pluskienthuc_menu'>
<div class='menu_ngang'>
<div class='logo_menungang'>
<a href='/' title='Trang chủ'><span>H</span>Hồng Hải Blog</a>
</div>
<div class='chuyenmuc_menungang'>
<div class='chuyenmucmenungang'>
<li><a href='/search/label/Thủ%20Thuật%20Windows' title='Thủ Thuật Windows'>Windows</a></li>
<li><a href='/search/label/Thủ%20Thuật%20Facebook' title='Facebook'>Facebook</a></li>
<li><a href='/search/label/Thủ%20Thuật%20Blogspot' title='Blog'>Blog</a></li>
<li><a href='/search/label/PSD%20Ảnh%20bìa' title='Ảnh Bìa'>Ảnh Bìa</a></li>
</div>
</div>
<div class='search_menungang'>
<style>#searchform{float:right;margin:0;padding:0}#searchform fieldset{padding:0;border:none;margin:0}#searchform input[type=&quot;text&quot;]{outline:0;background:rgba(0,0,0,.15) url(http://sv1.upsieutoc.com/2017/09/02/icon8aa3b.png) left no-repeat;border:none;background-size:30px 30px;background-position:97% 50%;float:left;padding:0 25px 0 15px;height:60px;margin:0;width:280px;color:#fff;letter-spacing:-.5px;font:400 16px &quot;Roboto&quot;,sans-serif;transition:.65s;border-radius:0;cursor:pointer}#searchform input:focus{outline:0;background:rgba(0,0,0,.245) url(http://sv1.upsieutoc.com/2017/09/02/icon8aa3b.png) left no-repeat;border:none;background-size:30px 30px;background-position:2% 50%;float:left;padding:0 10px 0 40px;margin:0;width:270px;color:#fff;letter-spacing:-.5px;font:400 16px &quot;Roboto&quot;,sans-serif;border-radius:0;cursor:text}#searchform ::-webkit-input-placeholder{color:#eee}</style>
<form action='/search' id='searchform' method='get' title='Tìm kiếm'>
<fieldset>
<input class='text_input' id='s' name='q' onblur='if(this.value==&apos;&apos;){this.value=&apos;Tìm kiếm thủ thuật, phần mềm,...&apos;;}' onfocus='if(this.value ==&apos;Tìm kiếm thủ thuật, phần mềm,...&apos;) {this.value=&apos;&apos;; }' placeholder='Tìm kiếm thủ thuật, phần mềm,...' type='text' value='Tìm kiếm thủ thuật, phần mềm,...'/>
</fieldset>
</form>
</div>
</div>
</div>
Bước 2. Chỉnh sửa lại sao cho phù hợp và lưu mẫu.
Chúc Các Bạn Thành Công!!

Nhận Thiết Kế

fb.com/HongHai.H.T.H
instagram.com/honghai.des
01682253xxx
honghai251325@gmail.com

Facebook Comments

36 nhận xét :

  1. Cảm ơn bác :)) Search box hiệu ứng trượt rất đẹp ạ.

    Trả lờiXóa
  2. Cái này rất hữu ích với 1 số bạn đấy :)

    Trả lờiXóa
  3. Hải baby :*
    Cho tui xin cái liên kết nha <3
    URL: http://gaixinh2018.blogspot.com/
    Tên hiển thị: Ngắm Gái Xinh
    Cám ơn trước nhé!

    Trả lờiXóa
  4. Liên kết bác ơi
    https://leminhut.blogspot.com/

    Trả lờiXóa
  5. Share temp cũ dc không

    Trả lờiXóa
  6. Wow! Theme mới mượt đấy chứ :D.Cho a xin link down temp gốc với nào

    Trả lờiXóa
    Trả lời
    1. đây anh: https://drive.google.com/file/d/17ySQI0Cg45esQzn9kSvqrn2x3gBXsqTq/view?usp=drivesdk

      Xóa
  7. À há, temp 2 ae mình từ 1 bố mẹ này :D

    Trả lờiXóa
  8. Bố cục nhìn cứng và cứng cứng cứng...

    Trả lờiXóa
    Trả lời
    1. em thấy cũng bình thg mà a đâu cứng cứng đâu

      Xóa
  9. Vắng mặt đâu thời gian rồi ?

    Trả lờiXóa