NTM Solutions

Thứ Tư, 27 tháng 7, 2022

MÃ MORSE

Những ai am hiểu công nghệ thông tin và yêu thích mật mã chắc cũng từng nghe qua mã mọt (MORSE)

là phương pháp được sử dụng trong viễn thông để mã hóa văn bản ký tự như trình tự chuẩn của 02 khoảng thời gian tín hiệu khác nhau, là dấu chấm (dot) và dấu gạch ngang (dash).

Mã Morse được đặt theo tên của Samuel Morse, nhà phát minh điện báo.

Đây là bức điện báo đầu tiên trong lịch sử nhân loại.

Bức điện báo đầu tiên trên thế giới
Nội dung thông điệp là: “What hath God wrought”

Bảng mã Morse quốc tế bao gồm 26 chữ cái tiếng Anh không phân biệt HOA-thường.

Mỗi chữ cái được hình thành bởi các dấu chấm gạch ngang.

Thời lượng dấu chấm là đơn vị đo cơ bản.

Thời lượng gạch ngang gấp 03 lần dấu chấm.

Bảng mã Morse quốc tế

Thứ Bảy, 9 tháng 7, 2022

Tự học CSS - Bài 34 - Website layout

Website Layout

01 trang web thường được chia thành các phần như: header, menus, phần chứa nội dung và footer.

Có rất nhiều kiểu thiết kế layout khác nhau. Nhưng nhìn chung, cấu trúc trang web như trên rất dễ gặp. Chúng ta hãy cùng xem xét kỹ cấu trúc này.

Header

01 header thường nằm ở đỉnh trang web (hoặc bên phải ngay dưới menu điều hướng top). Nó thường chứa 01 logo hoặc tên trang web.

Ví dụ:

.header {
  background-color
: #F1F1F1;
  text-align
: center;
  padding
: 20px;
}

Navigation Bar

01 thanh điều hướng chứa danh sách các liên kết để giúp người dùng di chuyển xuyên suốt trang web.

Ví dụ:

/* The navbar container */
.topnav
{
  overflow
: hidden;
  background-color
: #333;
}

/* Navbar links */
.topnav a
{
  float
: left;
  display
: block;
  color
: #f2f2f2;
  text-align
: center;
  padding
: 14px 16px;
  text-decoration
: none;
}

/* Links - change color on hover */
.topnav a:hover
{
  background-color
: #ddd;
  color
: black;
}

Thứ Tư, 6 tháng 7, 2022

Tự học CSS - Bài 33 - Định dạng số đếm thẻ TIÊU ĐỀ

 CSS counters là “các biến” được lưu giữ bởi CSS, trong đó các giá trị này có thể tăng lên bởi các qui tắc thiết lập của CSS (để lưu lại số lần chúng được dùng). Counters cho phép bạn tùy biến giao diện nội dung dựa vào những thay thế của nó trên văn bản.

Số tự động với counters

CSS counters giống như “các biến” vậy.

Giá trị biến có thể tăng bởi các qui tắc thiết lập trong CSS (chúng sẽ ghi lại bao nhiêu lần đã được dùng).

Để làm việc với CSS counters, chúng ta sẽ dùng các thuộc tính sau:

·         counter-reset – tạo hoặc resets lại 01 counter

·         counter-increment – tăng 01 giá trị counter

·         content – chèn nội dung phát sinh


Hàm counter() hoặc counters() – thêm giá trị của 01 counter vào 01 phần tử.

Để dùng 01 CSS counter, ban đầu ta phải tạo ra bằng counter-reset

Ví dụ sau tạo ra 01 counter cho trang (trong phần chọn qua body), sau đó tăng giá trị counter sau mỗi thẻ <h2> và thêm “Section <giá trị của counter>:” vào đầu mỗi thẻ <h2>

body {
  counter-reset
: section;
}

h2::before
{
  counter-increment
: section;
  content
: "Section " counter(section) ": ";
}

Thứ Bảy, 2 tháng 7, 2022

Tự học CSS - Bài 32 - Định dạng biểu mẫu

Định dạng INPUT

Sử dụng thuộc tính width để khai báo bề ngang của input.

input {
  width
: 100%;
}

Ví dụ trên áp dụng cho tất cả phần tử <input>. Nếu bạn chỉ muốn định dạng 01 input nhất định, bạn có thể dùng cách chọn qua thuộc tính.

input[type=text] – chỉ chọn text fields

input[type=password] – chỉ chọn các password fields

input[type=number] – chỉ chọn các number fields

và còn nhiều trường khác nữa.


Padded Inputs

Dùng thuộc tính padding để thêm khoảng trắng bên trong text field.

Mẹo: khi bạn có nhiều inputs xen kẽ nhau, bạn cũng sẽ muốn thêm vào margin để thêm khoảng cách giữa chúng.

input[type=text] {
  width
: 100%;
  padding
: 12px 20px;
  margin
: 8px 0;
  box-sizing
: border-box;
}

Chú ý rằng chúng ta thiết lập thuộc tính box-sizing cho border-box. Điều này đảm bảo rằng padding và ngay cả các đường viền được bao gồm trong kích thước tổng chiều cao và bề rộng của các phần tử.

Facebook Youtube RSS