Đơn vị CSS, một số đơn vị đo ít người biết

-
ngoài  px, em, rem, vw, vh. chúng ta còn có một số đơn vị ít người biết đến.

Đơn vị tương đối

vi
1vi = 1% kích thước của viewport theo trục inline

vb
1vb = 1% kích thước của viewport theo trục block

Trục inline và block được xác định theo writing-mode
vi là kích thước song song với luồng văn bản trong một dòng, tức là kích thước ngang trong chế độ viết ngang và kích thước dọc trong chế độ viết dọc. Đối với văn bản tiếng Anh chuẩn, đó là kích thước ngang
vb là kích thước vuông góc với luồng văn bản trong một dòng, tức là kích thước dọc trong chế độ viết ngang và kích thước ngang trong chế độ viết dọc. Đối với văn bản tiếng Anh chuẩn, đó là kích thước dọc
1cap = chiều cao giới hạn của chữ cái viết hoa có sẵn đầu tiên
1ic = chiều rộng của chữ cái “水” (CJK water ideograph, U+6C34)
1lh = chiều cao của lineheight hiện tại
Giống như mối quan hệ giữa em và rem thì rlh là chiều cao của lineheight gốc
1Q = 0.4mm = 0.04cm
400grad = 360deg
2πrad = 360deg
1turn = 360deg
1kHz = 1000Hz

Comments

Post a Comment

Bài đăn phổ biến

Tính Bình Phương 1 Số Trong Python

-
     Python là 1 ngôn ngữ rất thông dụng hiện nay nó được xem là 1 máy tính bỏ túi cực kì tiện lợi , sau đây tôi sẽ hướng dẫn cách tính bình phương 1 số trong python       //đầu tiên ta khai báo 1 hàm     def binhPhuong(x):   //def là defile     ' ' '      bình phương là lấy 1 số mủ 2     // dấu ' ' ' là phần trợ giúp trong python muốn sữ dụng trợ giúp ta                                                                chỉ cần gọi lệnh    help(binhPhuong)  enter thì phần trợ giúp sẽ                                                                xuất hện     ' ' '   return  x**2  // 1 dấu * là phép nhân 2 dấu ** là mủ số.   Save chương trình lại và bấm F5 để chạy     muốn tính bình phương số nào ta chỉ cần gọi hàm    binhPhuong(x)  x là 1 số bất kì bạn tự nhập.
Read more

Deploy website lên VPS hoặc Hosting với Gitlab CI/CD

-
Image
  Deploy website lên VPS với Gitlab CI/CD Sau một thời gian code ra được môt trang web xịn xò thì bạn có nhu cầu đưa lên internet để mọi người được biết. Bắt đầu với công việc đầu tiên là tìm mua tên miền, hosting hoặc VPS. Bạn có thể mua VPS tại Hostinger hoặc Vultr,... 1 VPS có thể cài đặt được nhiều trang web. Như vậy sau quá trình chuẩn bị thành công, chúng ta sẽ đẩy code từ local lên hosting, server. Quá trình này khá là mất công. Cách cổ điển hiện nay được nhiều người dùng là dùng FTP, hoặc upload thằng từ các trang quản lý. Đây là công việc khá nhàm chán, tốn thời gian. Khi có một thay đổi nhỏ là phải đi thao tác lại. Chính vì vậy khái niệm CI/CD ra đời. CI/CD là một bộ đôi công việc, bao gồm CI ( Continuous Integration ) và CD ( Continuous Delivery ), ý nói là quá trình tích hợp (integration) thường xuyên, nhanh chóng hơn khi code cũng như thường xuyên cập nhật phiên bản mới (delivery). Có khá nhiều công cụ hỗ trợ CI/CD, nhưng trong phạm vi bài viết chỉ đề cập công cụ CI/CD của
Read more

Đổi tên "READ MORE" trong bài post

-
Nhiều khi bạn không thích chử mặc định trong wordpress nên mình cũng có 1 cái filter để làm việc này nhìn ví dụ bên dưới function vd_readmore(){     return '<a class="read-more" href=" '.  get_permalink( get_the_ID() )  . ' "> ' .__('[Đọc Thêm]', 'textdomain'). ' </a>'; } add_filter('excerpt_more', 'vd_readmore');
Read more

MỞ CAMERA VÀ CHỤP ẢNH BẰNG PHP

-
   Hôm nay mình phát hiện 1 đoạn code hay nói về việc mở camera và chụp ảnh bằng code php nên share cho các bạn.    Nên tạo 1 file .html và bỏ trong folder htdocs nếu bạn sài server là xampp, và bỏ vào folder www nếu bạn sài server là wamp. <!doctype html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>Get User Media - Photo</title> </head> <body> <button id="take">Take a photo</button><br /> <video id="v"></video> <canvas id="canvas" style="display:none;"></canvas> <img src="http://placehold.it/300&text=Your%20image%20here%20..." id="photo" alt="photo"> <script>     ;(function(){         function userMedia(){             return navigator.getUserMedia = navigator.getUserMedia ||             navigator.webkitGetUserMedia ||             navigator.mozGetUserMedia |
Read more