Hướng dẫn kỹ thuật tạo menu dọc có dropdown đơn giản
Mặc dù menu ngang vẫn được sử dụng nhiều hơn nhưng bên cạnh đó mình biết có rất nhiều bạn vẫn muốn làm các menu hiển thị kiểu dọc. Nên ở bài này mình sẽ hướng dẫn qua cho các bạn một kỹ thuật để tạo menu dọc đơn giản nhưng vẫn đẹp mắt.
Về...
Hướng dẫn kỹ thuật tạo menu ngang dropdown đơn giản
Các bạn có tin không? Đối với ai mình không biết chứ đối với mình, việc tạo menu (dù ngang hay dọc) trong CSS rất khó khăn đối với mình ở thời gian đầu. Vì để tạo được một menu với CSS thì cần phải vận dụng rất nhiều kiến thức về CSS mặc dù nó...
Tìm hiểu một vài Pseudo Class cơ bản
Đây có thể nói là bài hướng dẫn chi tiết từng tính năng trong CSS cuối cùng của serie CSS đơn giản này và các bài sau chúng ta sẽ làm qua một số ví dụ thực tế. Trước khi bắt đầu với một số ví dụ đó, mình muốn nói qua một xíu về Pseudo Class – một tính năng...
Tìm hiểu thuộc tính Position Absolute và Relative
Trong CSS, khi bạn di chuyển bất cứ một phần tử nào bằng các thuộc tính về Box Model như margin hoặc float thì các phần từ bên cạnh nó đều sẽ bị ảnh hưởng. Ví dụ bạn sử dụng margin để chuyển phần tử A thì cái thằng bên cạnh nó cũng sẽ di chuyển...
Tìm hiểu thuộc tính display và tùy biến loại phần tử với display
Ở phần đầu của serie Học CSS cơ bản này mình đã có nói qua về thuộc tính Block và Inline là như thế nào và tầm quan trọng của nó trong việc thiết kế bố cục chơ website với CSS. Hiện tại chắc bạn đã biết thế nào là Block và Inline...
Cách tùy biến trang trí danh sách với list-style
Mặc định các thẻ list (danh sách) trong HTML sẽ được hiển thị dựa trên quy tắt hiển thị ở các trình duyệt cho các thẻ đó. Ví dụ khi bạn sử dụng <ol> thì sẽ hiển thị danh sách có đánh số, thẻ <ul> sẽ hiển thị dấu chấm tròn cho mỗi mục con bên...
Tìm hiểu Reset CSS và vì sao nên reset CSS
Bạn học HTML thì chắc cũng thừa biết là mặc định trình duyệt đã tự mặc định hiển thị một số thẻ HTML thành một đoạn văn bản đã được markup đầy đủ, ngoài ra thì nó cũng mặc định thêm một số quy tắc trên trang tài liệu web HTML như có chứa padding...
Tìm hiểu cách chia cột với float và clear float
Chào mừng các bạn đến với một kỹ thuật rất quan trọng trong CSS Layout, mà đã từng làm nhiều người phải “sợ” nó, đó chính là học cách chia cột trên CSS. Có thể nói rằng, website bạn soạn ra bằng văn bản HTML sẽ luôn luôn có một cột duy nhất mà nếu...
Tìm hiểu cách thêm thuộc tính màu nền và ảnh nền cho website
Tạm gác qua các khái niệm về Box Model qua một bên mà ở phần này chúng ta sẽ làm quen với một loại thuộc tính cũng rất thú vị và có tác dụng làm đẹp website của bạn lên hơn, đó là các thuộc tính thêm màu nền và ảnh nền cho website...
Tìm hiểu cách tính toán lại kích thước của box với box-sizing
Khi các bạn học qua Box Model trong CSS thì sẽ thấy có một đặc điểm khi sử dụng Padding và Border thì cái khung phần tử của bạn sẽ bị biến đổi kích thước nếu bạn có đặt thêm thuộc tính width và height để thiết lập kích thước cho nó...
Tìm hiểu cách sử dụng các thuộc tính tùy chỉnh kích thước trong CSS
Khi làm việc với Box Model nói riêng và CSS Layout nói chung thì ngoài việc chúng ta cần tinh chỉnh cách hiển thị cho mỗi phần tử thì còn có một việc khác nữa mà bạn cũng sẽ rất thường xuyên làm đó là thiết lập kích thước cho...
Tìm hiểu về kỹ thuật Box Model và các thuộc tính
Box Model là một kỹ thuật cơ bản nhất trong CSS Layout và được sử dụng để bạn mô tả về khoảng cách mà mỗi phần tử trên website được sở hữu, hay nói cách khác là kỹ thuật tinh chỉnh khoảng cách hiển thị cho mỗi phần tử trên website.
Kỹ thuật...
Cách sử dụng thẻ div và tạo bố cục trên website
Ở phần tìm hiểu về Inline và Block trước thì mình có nhắc qua thẻ <div> và đây là một thẻ phổ biến rất hay được sử dụng.
Bởi vì thẻ <div> nếu bạn chỉ sử dụng trong HTML không thì có thể bạn sẽ chưa hiểu lắm về vai trò của nó dẫn đến việc hiểu...
Tìm hiểu phần tử Block (khối) và Inline (nội dòng)
Nếu nói về các thuộc tính CSS cho việc trang trí văn bản thì cũng chỉ có các thuộc tính mà bạn đã xem ở hai phần trước. Nhưng một cái khó nhất trong CSS đó là sử dụng kỹ thuật CSS Layout như thế nào cho chính xác để lên bố cục giao diện website...
Cách sử dụng các thuộc tính trang trí font chữ cho văn bản
Bên cạnh việc trang trí văn bản với CSS mà ta đã học ở phần trước, nhưng để đoạn văn bản có thêm sức sống thì không thể thiếu việc trang trí hoặc thiết lập lại việc hiển thị font chữ cho đoạn văn bản đó.
Không giống như các thuộc...
Cách sử dụng các thuộc tính trang trí cho Text (văn bản)
Đây là bài mở đầu cho loạt bài viết tìm hiểu về các thuộc tính quan trọng trong CSS mà bạn cần nắm. Một trong các loại thuộc tính đơn giản nhất nhưng lại dùng nhiều nhất là các thuộc tính được dùng để thay đổi cách hiển thị của văn bản...
Tìm hiểu về các đơn vị đo lường cơ bản px, pt, percentages, em và rem
Mặc dù có lẽ mình sẽ cần nói qua hơi nhiều các khái niệm cơ bản trước khi bắt đầu với việc tìm hiểu các thuộc tính CSS. Dù mất thời gian hơn nhưng nó sẽ giúp bạn đỡ bối rối về sau này khi gặp những khái niệm đó.
Một trong...
Tìm hiểu các kiểu vùng chọn CSS cơ bản (Selector)
Vùng chọn trong CSS đóng vai trò rất quan trọng khi viết CSS, bởi vì nếu bạn sử dụng vùng chọn sai thì điều đó có nghĩa là các quy tắc CSS của bạn sẽ không thể thực thi hoặc thực thi không đúng chỗ. Có thể nói rằng, việc nắm rõ quy tắc sử dụng...
Tìm hiểu CSS và vai trò của nó trên website
CSS là chữ viết tắt của Cascading Style Sheets, nó là một ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử được tạo ra bởi các ngôn ngữ đánh dấu (ví dụ như HTML). Bạn có thể hiểu đơn giản rằng, nếu HTML đóng vai trò định dạng các phần tử trên...