Mã màu chuẩn CMYK, RGB, HEX, HTML, CSS thông dụng

Bảng mã màu bao gồm các thông tin sau:

• Tên màu: Tên gọi chung của màu sắc bằng tiếng Việt và tiếng Anh.

• Mã màu HTML: Dùng để hiển thị màu sắc trên trang web.

• Mã màu CSS: Dùng để định dạng màu sắc trong CSS.

• Giá trị RGB: Biểu diễn màu sắc bằng ba thành phần: Red (đỏ), Green (xanh lá cây) và Blue (xanh lam). Mỗi thành phần có giá trị từ 0 đến 255.

• Giá trị CMYK: Biểu diễn màu sắc bằng bốn thành phần: Cyan (lục lam), Magenta (đỏ tươi), Yellow (vàng) và Black (đen). Mỗi thành phần có giá trị phần trăm từ 0% đến 100%.

Vì lý do thường xuyên chỉnh sửa blog nên mình hay mò tìm mấy cái mã màu html, css... Mà lúc nào cũng phải tốn thời gian lên google tìm, thôi thì bê của mấy trang có mã màu về lun cho nhanh. Bạn nào cần thì vào lụm nhé! 🤨

Hashtag: Mã màu chuẩn CMYK, RGB, HEX, HTML, CSS thông dụng

Blogger Chitose2D

Tạo hộp download Anime và Manga với chức năng Ẩn/Hiện Javascript

Hộp download Anime và Manga là gì? Ờ thì nó là hộp để link download Anime và Manga??? 🤨 Với một số bạn nào thường dùng blog để làm nơi lưu trữ phim, anime, manga các kiểu thì bạn đặt link tải kiểu gì nè?

Đa số các mẫu blog không có code hỗ trợ sẵn, do vậy chúng ta chỉ có cách tạo link trực tiếp luôn trên bài viết, trông thì đơn giản nhanh gọn nhưng không đẹp mắt cho lắm, nhất là với các blog làm về nội dung mà hay chèn link tải chia thành nhiều tập, độ phân giải cùng vô số server để dự phòng.

Vậy phải làm như nào? Bên dưới đây chính là cách tạo hộp download Anime và Manga với chức năng Ẩn/Hiện Javascript.

• Ưu điểm: Code nhẹ không gây nặng trang, trông đẹp mắt và chuyên nghiệp hơn nhiều.

• Bạn có thể xem demo từ ảnh trên hoặc click vào Download: Tên Anime: Ẩn/Hiện ở bên dưới. 👇

Episode 1

• 360p Server: Google Drive Server: 2 Server: 3
• 480p Server: Google Drive Server: 2 Server: 3
• 720p Server: Google Drive Server: 2 Server: 3
• 1080p Server: Google Drive Server: 2 Server: 3

Episode 2

• 360p Server: Google Drive Server: 2 Server: 3
• 480p Server: Google Drive Server: 2 Server: 3
• 720p Server: Google Drive Server: 2 Server: 3
• 1080p Server: Google Drive Server: 2 Server: 3

Episode 3

• 360p Server: Google Drive Server: 2 Server: 3
• 480p Server: Google Drive Server: 2 Server: 3
• 720p Server: Google Drive Server: 2 Server: 3
• 1080p Server: Google Drive Server: 2 Server: 3

Bước 1: Chủ đề > Tùy chỉnh > Chỉnh sửa HTML > Chèn CSS dưới đây, nhớ là dán trước thẻ đóng </head> xong lưu lại.

<style type='text/css'>
/* Tạo hộp download Anime và Manga với chức năng Ẩn/Hiện Javascript
============================ */
#db-area{margin:0 auto;margin-bottom:5px;position:relative;padding:2px;border:1px solid #ddd;background:#eee}
#db-area button{background-color: #3399FF;padding: 10px 12px; border-radius: 3px;border: none;color: #fff;width: 50%;}
#db-area .db-ini h2{margin:auto;font-size:15px;background-color:#333;display:block;color:white;padding:5px;border-radius:1px}
#db-area .db-ini ul{list-style:none;padding:5px;margin:auto}
#db-area .db-ini ul li{margin:3px auto}
#db-area .db-ini ul li b,#db-area .db-ini ul li a{display:inline-block;padding:3px 5px;border-radius:3px;text-decoration:none;color:white}
#db-area .db-ini ul li a{background-color:#7e8392}
#db-area .db-ini ul li a:hover{text-decoration:underline}
#db-area .db-ini ul li:nth-child(even) b{background-color:#df5b5b}
#db-area .db-ini ul li:nth-child(odd) b{background-color:#339999}
</style>

Bước 2: Thêm đoạn JavaScript dưới đây vào trước thẻ đóng </body> và lưu lại.

<script type="text/javascript">
   const targetDiv = document.getElementById("db-isi");
    const btn = document.getElementById("db-toggle");
    btn.onclick = function () {
      if (targetDiv.style.display !== "none") {
        targetDiv.style.display = "none";
      } else {
        targetDiv.style.display = "block";
      }
    };
</script>

Bước 3: Vào bài viết Blogspot > Chuyển sang Chế độ xem HTML > copy và dán đoạn code dưới này vào trong bài viết của bạn.

<div id="db-area">
 <span style="font-family: Mali; font-size: medium;"><button id="db-toggle"><span><strong>Download: </strong>Tên Anime: Ẩn/Hiện</span></button>
 <div id="db-isi" style="display: none;">
   <div class="db-ini">
     <h2>Episode 1</h2>
     <ul>
       <li><b>360p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>480p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>720p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>1080p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
     </ul>
   </div>
   <div class="db-ini">
     <h2>Episode 2</h2>
     <ul>
       <li><b>360p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>480p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>720p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>1080p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
     </ul>
   </div>
   <div class="db-ini">
     <h2>Episode 3</h2>
     <ul>
       <li><b>360p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>480p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>720p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
       <li><b>1080p</b> <a href="#">Server: Google Drive</a> <a href="#">Server: 2</a> <a href="#">Server: 3</a></li>
     </ul>
   </div>
 </div>
</span></div>

Lưu ý: Trước khi dùng đoạn code này, hãy viết bài nội dung quần văn què gì đó rồi chuyển sang chế độ xem HTML > Copy code trên dán vào cuối bài viết của bạn. Chủ yếu là để trông chuyên nghiệp và đẹp mắt hơn ấy mà. 🙄

Đây là code lụm bên trang indo, nguồn code.ruidrive nhé!

Hashtag: Tạo hộp download Anime và Manga với chức năng Ẩn/Hiện Javascript

Blogger Chitose2D Code hay tiện ích

Template Blogspot Iori Kyun Free

Iori Kyun là một mẫu giao diện thích hợp với những bạn đam mê viết truyện. Phải nói quá là thích hợp lun đi chớ. Tại sao ư? Nghĩ thử xem, nếu bạn là người có sở thích sáng tác truyện, tiểu thuyết, truyện ngắn, thơ ca... thay vì đăng trên các trang facebook, group khiến cho tác phẩm của bạn dễ bị trôi đi, hơn nữa, lại ít người quan tâm do đặc thù người xem fb rất hay lướt.

Phần lớn mọi người đều éo rảnh để tương tác truyện của bạn, đó chính là vấn đề và để giải quyết nó, bạn hãy chủ động hướng sự chú ý của độc giả. Ví dụ, thay vì trưng bày bó rau trên sạp đợi ai đó đi qua mua thì hãy vác nó lên và tự lết cái thân đi bán dạo. Tương tự như vậy với truyện mà bạn sáng tác ra.

Việc sở hữu một trang blog ngày nay với nhiều người thật sự quá dễ dàng, bạn có thể viết truyện trên nó, thông tin về các nhân vật, ảnh minh họa và các chi tiết về bộ truyện bạn đang viết lên blog. Trông chuyên nghiệp hơn nhiều so với việc vứt lên các trang hội nhóm facebook đúng không nào.

Giờ thì bạn chỉ việc chia sẻ link trang truyện của bạn cho bất kỳ ai, trên group, fanpage, mấy web truyện nào đó. Mà thui éo dài dòng nữa, bên dưới đây là thông tin chi tiết về mẫu theme blogger Iori Kyu được chia sẻ trên trang Chitose2D, theme cực kỳ đơn giản dễ cài đặt và có đủ tính năng cần thiết cho một trang blog truyện.

Hashtag: Template Blogspot Iori Kyun Free

Blogger Chitose2D Templates Blogspot Free

Code bộ đếm từ văn bản

Code này thì để làm cái éo gì? Ờm thì tự nhiên nhớ lại chuyện ngày xửa ngày xưa, đâu đó vào khoảng giữa năm 2017, cái thời nghiện light novel đến nổi đọc tới gần 4 giờ sáng chưa ngủ, ôi nghĩ lại đúng là hao tổn sức khỏe vãi đáiiiii.

Một thời gian sau cũng vì vậy mà tập tành viết truyện đăng trên mấy web kia, nhưng thường có yêu cầu là phải đủ số từ ít nhất phải 2, 3000. Và nhờ code đơn giản này mà đếm số từ văn bản trở nên khá dễ dàng. Bạn có thể xem demo và code bên dưới. 👇

Nhập nội dung văn bản của bạn:

Số từ: 0

Dán code này vào bất kỳ đâu trên blog của bạn, tốt nhất là tạo một bài viết >> Chuyển sang chế độ HTML >> Copy và dán code dưới đây.

<div class="containerg">

  <textarea id="text"></textarea>
  <p id="wordCount"><b>Số từ: <span style="color: #cc0000;">0</span></b></p>
</div>
<script>
  const textArea = document.getElementById('text');
  const wordCountElement = document.getElementById('wordCount');
 
  textArea.addEventListener('input', updateWordCount);
 
  function updateWordCount() {
    const text = textArea.value;
    const words = text.trim().split(/\s+/).filter(word => word !== '');
    const wordCount = words.length;
 
    wordCountElement.textContent = `Số từ: ${wordCount}`;
  }
</script>

<style>
{
    font-family: Mali, sans-serif;
    text-align: center;
    margin: 0;
    padding: 0;
  }
  .containerg {
    display:;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto;
  }
  textarea {
    width: 100%;
    height: 150px;
    margin-bottom: 10px;
    padding: 5px;
    border: 1px solid #ccc;
    resize: vertical;
  }
</style>

P/s: Làm bài viết này xong tự nhiên có hứng viết truyện ghê, cơ mà được vài phút mất cmn hứng lun. 😓

Hashtag: Code bộ đếm từ văn bản

Blogger Chitose2D Code hay tiện ích

Green Scarf Emoticons | Biểu tượng cảm xúc

Bạn thắc mắc mấy cái Emoticons này để làm cái quần què gì ư? À thì bạn có thể làm nhiều thứ ví dụ như... lụm link ảnh chèn vào phần bình luận trên blog này cho đẹp nhé!

Phần tếp theo là bộ Green Scarf Emoticons. 😗

Hashtag: Green Scarf Emoticons | Biểu tượng cảm xúc

Emoticons

Tuyết rơi bụi bay | Hiệu ứng ghép video nền/màn mình đen

Hiệu ứng ghép video nền/màn mình đen.

Tên hiệu ứng video: Tuyết rơi bụi bay

Độ dài: 00:14

Hỗ trợ độ phân giải: (720p.MP4 - HD)

Xem demo trên Youtube: https://www.youtube.com/watch?v=6uDt18HdIHI | Thánh Che Mắt.

↓ Xem link tải: Tuyết rơi bụi bay | Hiệu ứng ghép video nền/màn mình đen bên dưới phần bình luận của bài viết này ↓

Hashtag: Tuyết rơi bụi bay | Hiệu ứng ghép video nền/màn mình đen

Hiệu ứng video