---------
Phần 13.
Xem CSS trong ứng dụng web
Học kiểu gì thì học, cuối cùng vẫn phải là dùng được. Giờ mở
mã nguồn của một số ứng dụng web ra, xem trong đó CSS được dùng như thế nào.
Nếu chưa có mã nguồn của một số ứng dụng web, thì theo hướng
dẫn ở đây để tải về http://legiacong.blogspot.com/2016/08/ngu-ngo-hoc-lam-web-2-xem-mot-ung-dung.html
Cũng tương tự như trong phần xem mã HTML, mở mã nguồn của dự
án openemr, tìm và mở tập tin index.php trong thư mục gốc. Trong tập tin index.php,
chưa thấy sử dụng CSS. Mở tiếp tập tin login.php trong interface/login/, sẽ thấy trong vùng <head></head> có
hai dòng mã sau:
<link rel=stylesheet href="<?php echo
$css_header;?>" type="text/css">
<link rel=stylesheet href="../themes/login.css"
type="text/css">
Đây là hai khai báo để sử dụng CSS cho trang login.php. Mở
tập tin "../themes/login.css", để xem CSS được viết trong đó.
Bắt chước cách người ta viết dấu {}, khoảng trắng, xuống
dòng, dấu :, khoảng cách giữa các định nghĩa CSS, cách dùng đơn vị đo (px), giá
trị màu, tại sao border-radius lại phải viết tới ba hàng
(-webkit-border-radius, -moz-border-radius và border-radius).
Duyệt qua các tập tin CSS trong thư mục themes để xem cách
viết CSS trong dự án openemr.
Để ý thấy là, họ thường viết CSS trong các file riêng, rồi
gọi vào sử dụng trong file HTML. Việc CSS ngay trong thẻ HTML hoặc trong vùng
<head> cũng có, nhưng rất ít khi sử dụng.
Mở tiếp một ứng dụng web khác (bookmarker-tutorial-master)
để xem. Mở hai tập tin base.css và cake.css theo đường dẫn bookmarker-tutorial-master\webroot\css để xem cách viết CSS.
Ngó nghiêng cho biết vậy thôi, cứ xem như là một lần đi tham
quan thực tế, thôi! về lại nhà và tự học tiếp.
-----------
Cập nhật [1/9/2020]
-----------