Cách dùng thẻ abbr trong HTML

Thẻ abbr dùng để chú thích từ viết tắt giúp cho máy tìm kiếm, công cụ dịch thuật, công cụ kiểm tra chính tả hiểu nội dung web tốt hơn. Code mẫu: Kết quả: UFO còn gọi là Vật thể bay không xác định. Thông tin được đưa vào thuộc tính title của thẻ abbr sẽ được sử dụng để biết từ đầy đủ của từ viết tắt. Khi bạn di chuột qua từ viết tắt, thông tin từ title cũng hiện ra. Bonus Nếu bạn muốn tìm nghĩa của các từ viết tắt mà mình chưa biết thì hãy …

Đọc thêm

Cách dùng thẻ label trong HTML

Thẻ label dùng để định nghĩa nhãn cho các thẻ input trong HTML. Tác dụng của label là làm cho thao tác nhập liệu trở nên dễ dàng hơn. Code mẫu: Kết quả: Họ tên: Giờ bạn có thể nhấn vào chữ Họ tên để vào ô nhập liệu, hay nói cách khác, thẻ label làm tăng diện tích click chuột bắt đầu thao tác nhập. Nếu không có thẻ label, khi click vào chữ Họ tên sẽ không có điều gì xảy ra, giống như ví dụ dưới đây: Họ tên: Cú pháp của thẻ label Thẻ label yêu …

Đọc thêm

9 thẻ input thường dùng trong HTML

Các thẻ input type chuyên dụng trong các form, dùng để nhập liệu, kiểu như: đăng ký, đăng nhập, liên hệ, gửi file…Hôm nay chúng ta sẽ xem xét các thẻ input phổ biến nhất nhé. Các input đều giống nhau về cấu trúc, chỉ khác nhau về type. Chính type này quyết định kiểu của input. Có đến hơn 20 type khác nhau. Một số type input chỉ được hỗ trợ trong HTML5. Các type giới thiệu trong ngày hôm nay được tất cả các trình duyệt thông dụng hỗ trợ. Nhập text Ví dụ: Họ và tên: Code …

Đọc thêm

Thực hành thuộc tính word-spacing trong CSS

Trong bài viết trước đây về 8 thuộc tính văn bản trong CSS tôi có đề cập đến word-spacing. Tuy nhiên bài đó chỉ là cái nhìn tổng quát. Hôm nay chúng ta sẽ đi vào chi tiết và các ví dụ cụ thể. Thuộc tính word-spacing được dùng để điều khiển khoảng cách chữ với nhau. Code mẫu Kết quả: Hà Nội mùa này vắng những cơn mưa. Cái rét đầu đông khăn em bay hiu hiu gió lạnh. Đặc điểm Giá trị mặc định: normal – giá trị này sẽ để khoảng cách chữ theo mặc định của font. Tính …

Đọc thêm

Cách dùng thẻ sup và sub trong HTML

Nếu hay phải viết các công thức toán học, hóa học, bạn sẽ cần dùng thường xuyên hai thẻ sup và sub. Nó được dùng để tạo chỉ số trên và chỉ số dưới. Thẻ sub Thí dụ công thức hóa học 2H2 + O2 = 2H2O, nếu không áp dụng chỉ số dưới sub thì trông sẽ như đoạn vừa gõ, để sửa lại, ta dùng đoạn code sau: Kết quả: 2H2 + O2 = 2H2O Thẻ sup Thí dụ phương trình bậc 2: ax2 + bx + c = 0 Đáng ra số 2 phải ở bên trên biến x. Để sửa …

Đọc thêm

Thực hành với thẻ select và option trong HTML

Thẻ select dùng để lựa chọn, ở khía cạnh nào đó nó giống với radio button, nhưng điểm khác biệt là select có kiểu dáng dạng drop-down menu (xổ xuống). Code mẫu: Kết quả: Chọn giá nhà bạn muốn muaTừ 300 triệu đến 400 triệuTừ 401 triệu đến 600 triệuTừ 601 triệu đến 800 triệuTừ 801 triệu đến 1.2 tỷ đồng 1. Thuộc tính name Đây là thành phần không thể thiếu của các thẻ nằm trong form, trong đó phải kể đến các thẻ input, textarea. Thẻ select cũng vậy, thuộc tính name cho phép JavaScript và các ngôn ngữ …

Đọc thêm

Ngắt dòng tự động với thuộc tính word-wrap trong CSS3

Thuộc tính word-wrap dùng để ngắt những từ quá dài, mà nếu bạn không dùng đến nó sẽ gây ra tình trạng phá vỡ layout (bố cục) của trang. Cách đơn giản nhất để hiểu thuộc tính này là thông qua ví dụ, chẳng hạn tôi có một danh sách các tên miền ưa thích như sau: 1.vnexpress.net2.dantri.vn3.www.google.com4.www.freehost.page Bạn dễ dàng thấy tên miền www.freehost.page bị tràn ra khỏi layout, sở dĩ như vậy vì nó dài hơn chiều rộng của box chứa nó. Để khắc phục tình trạng này ta dùng word-wrap với giá trị là break-word, code mẫu: …

Đọc thêm

Thuộc tính box-shadow trong CSS3

  Box-shadow là thuộc tính mới trong CSS, nằm trong phiên bản CSS3. Nó có tác dụng tạo bóng cho hộp (xem thêm mô hình hộp trong CSS). Ví dụ: Kết quả:   Khi sử dụng box-shadow có một số lưu ý sau: Bóng là một hộp có kích thước tương tự hộp ban đầu; Màu sắc mặc định của bóng là đen (mã màu: #000000); box-shadow: 20px 10px; quy định độ dịch chuyển của bóng so với vị trí gốc, theo đó giá trị đầu là dịch chuyển theo chiều ngang (20px), giá trị tiếp theo là dọc (10px); Bạn có …

Đọc thêm

Selector trong CSS là gì? Bạn có thể không biết rất nhiều selector thú vị đấy!

Trong khi thao tác CSS, bộ chọn (selector) là cái được viết ra đầu tiên. Nó là đối tượng mà chúng ta muốn tác động, tiếp theo mới viết các khai báo, trong khai báo có thuộc tính và giá trị (xem thêm cú pháp của CSS). Đễ cho dễ tưởng tượng hơn, giả dụ bạn là thợ sơn chuyên nghiệp, khách hàng alo cho bạn, anh ta muốn sơn ngôi nhà có màu xanh, và các viền cửa màu nâu. OK, chuyện đó chẳng khó gì với bạn, thế nhưng nếu khách hàng không cho biết địa chỉ cụ …

Đọc thêm

Mô hình hộp trong CSS

Với CSS, các thẻ HTML được xem như chiếc hộp. Hộp này có nội dung, đệm (padding), đường viền (border) và lề (margin). Sở dĩ bình thường bạn chẳng thấy cái hộp nào là bởi theo mặc định các giá trị trên được quy định là 0. Chỉ khi bạn gán một giá trị cụ thể cho nó, các đối tượng này mới hiện nguyên dạng. Giả dụ như dòng chữ này, bạn sẽ không thấy gì cả. Nhưng dòng này nó có đường viền, có đệm Và dưới đây là hình ảnh mô phỏng cho mô hình hộp trong …

Đọc thêm