Thứ Năm, 14 tháng 6, 2018

Hello mọi người hôm nay mình lại tiếp tục share thủ thuật blog Hướng dẫn tạo khung chứa code mình đang sử dụng cho mọi người
Cách Thực Hiện
Bước 1: Ta Chèn code phía dưới vào trước thẻ ]]></b:skin> nhé.
.post blockquote{margin:10px 0;text-align:left!important;padding:50px 10px 10px 15px;transition:.3s;font:400 17px Monospace;color:#888;max-height:400px;overflow:hidden;line-height:1.5;position:relative;background:#f4f4f4;border:2px solid #ddd;overflow:auto}
.post blockquote:before{content:'\f121  CODE';font-family:"Font Awesome 5 Free",Roboto Condensed;font-weight:700;position:absolute;font-size:1em;left:0;top:0;margin:0;display:block;width:100%;background:#ddd;padding:10px;box-sizing:border-box;    -webkit-transition: .3s;}
.post blockquote::-webkit-scrollbar{width:8px}
.post blockquote::-webkit-scrollbar-thumb{background:#ddd}
.post blockquote:-webkit-scrollbar-thumb:window-inactive{background:#ddd}
.post blockquote::-moz-scrollbar{width:8px}
.post blockquote::-moz-scrollbar-track{background:#eee}
.post blockquote::-moz-scrollbar-thumb{background:#ddd}
.post blockquote::-o-scrollbar{width:8px}
.post blockquote::-o-scrollbar-track{background:#eee}
.post blockquote::-o-scrollbar-thumb{background:#ddd}
.post blockquote:after{content:'Cick Double Để Copy Code';padding:2px 5px;width:auto;height:auto;font-family:"Font Awesome 5 Free",Roboto Condensed;position:absolute;right:8px;top:8px;color:#595b8a;font-weight:700;background-color:none;transition:all 0.3s ease-in-out;font-size:1em}
.post blockquote:hover::after{opacity:0;top:-8px;visibility:visible}
code{display: inline-block; position: relative; color: #6aafa3; margin: 0 5px; padding: 0 10px; transition: all .3s; border: 1px solid; border-radius: 4px; font: 400 18px Monospace;}
Bước 2: ta thêm đoạn js vào trước thẻ </body>
<script type='text/javascript'>
//<![CDATA[
for(var pres=document.getElementsByTagName("blockquote"),i=0;i<pres.length;i++)pres[i].addEventListener("dblclick",function(){var a=getSelection(),b=document.createRange();b.selectNodeContents(this);a.removeAllRanges();a.addRange(b)},!1);
//]]>
</script>
 vậy là xong.
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

31 nhận xét :

  1. Hồng Hải bữa nay chăm đăng bài thế ? Cơ mà khung chứa code cũng đẹp, tinh tế.

    Trả lờiXóa
  2. Hay lắm , à mà Hồng Hải ơi mình có cái template edit nhầm , khung comment màu trắng k nhỉn rõ chữ giờ muốn đổi màu thì sao vậy ? Help Me !!!

    Trả lờiXóa
  3. Hồng Hải ơi mình có cái template edit nhầm , khung comment màu trắng k nhỉn rõ chữ giờ muốn đổi màu thì sao vậy ? Help Me !!!

    Trả lờiXóa
  4. chữ trên khung nó lỗi hả ad ~ ~ rảnh ghé blog em góp ý giúp em phát triển nha https://quocbaoblogit.blogspot.com/

    Trả lờiXóa
  5. Trả lời
    1. có hướng dẫn dùng ở bài viết nhé :V

      Xóa
    2. nhớ thêm phần :v xóa cái khung cũ r mới thêm khung mới đc

      Xóa
  6. quá đẹp + thời gian đăng bài đẹp :v

    Trả lờiXóa
  7. Nhìn thì có vẻ như có ăn học mà cmt chẳng khác thằng vô học :)

    Trả lờiXóa