Trang chủ Lập trình Javascript - HTML CSS cho đối tượng trên màn hình di động lật ngang và...

CSS cho đối tượng trên màn hình di động lật ngang và dọc

Hôm nay đụng một yêu cầu là phải xử lý CSS cho đối tượng ở hai màn hình lật ngang và lật dọc. Lúc đầu mình định dùng thuộc tính @media với min-width, max-width. Tuy nhiên vì một số lý do nên không thể sử dụng vì nhiều thiết bị có các kích cỡ màn hình khác nhau nên nếu muốn viết tổng quát thì rất khó.

Và sau một hồi tìm kiếm thì phát hiện ra là CSS có hỗ trợ phân biệt cho màn hình thiết bị khi lật ngang hay lật dọc. Rất đơn giản.

Với portrait là màn hình dọc và landscape là màn hình ngang.

Chúc các bạn thành công.

Huỳnh Mai Anh Kiệt

- Advertisement -
Huỳnh Mai Anh Kiệthttps://www.mangbinhdinh.vn
Anh là một người đam mê công nghệ. Hiện tại anh là một lập trình viên tại Quy Nhơn.

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây

BÀI VIẾT MỚI

Hướng dẫn tạo bộ đếm lùi thời gian bằng JavaScript

Mới đó mà đã gần nửa năm 2021 trôi qua. Tình hình dịch bệnh COVID-19 cũng chẳng mấy khả quan. Nhưng vẫn cứ hy...

Hướng dẫn tạo hiệu ứng mưa rơi trên trang web với JavaScript

Quy Nhơn chớm bước vào mùa hè với nắng nóng. Những lúc thế này tự nhiên lại thèm những cơn mưa để giải tỏa...

Instagram ra mắt tính năng tạo chú thích tự động cho Stories và Reels

Tiếp bước TikTok, Instagram hiện cũng đã ra mắt tính năng tạo chú thích (caption) tự động của riêng mình. Tính năng mới này đã...

Facebook đã chính thức cập nhật tính năng “bong bóng chat” trên iPhone

Mới đây, Facebook đã chính thức cập nhật tính năng Chat Heads (hay còn gọi là bong bóng chat) trên iPhone, cho phép người...

Facebook Workplace đạt mốc 7 triệu người dùng trả phí

Vào thứ Ba vừa rồi, Facebook vừa mới thông báo ứng dụng Facebook Workplace của họ tính cho tới thời điểm hiện tại đã...

BẠN XEM CHƯA

Look Back

Facebook kỷ niệm 10 năm và chợt nhận ra mình đã dùng Facebook 5 năm rồi. Cùng nhìn lại 5 năm Facebook của mình...

Tìm kiếm nhanh thông tin từ cửa sổ Word

Thông thường để tìm kiếm thông tin liên quan đến từ một từ nào đó (chẳng hạn như kiểm tra chính tả) trong văn...

Vấn đề tự động scroll đến cuối trang của reCaptcha trên iOS

Hôm nay nhận được một yêu cầu của khách hàng mô tả về vấn đề của reCaptcha trên iOS. Cụ thể là khách hàng...

Hướng dẫn tạo phụ đề hiệu ứng Karaoke cho video

Chắc các bạn đã từng xem một video clip ca nhạc có phụ đề hiệu ứng karaoke đẹp mắt. Bài viết sau đây sẽ...

Dễ dàng tải theme và plugin đang sử dụng với WP Downloader

Cách duy nhất để tải theme hoặc plugin đang sử dụng cho trang web đang chạy bằng Wordpress là truy cập vào trang quản...