Hướng dẫn fix lỗi liên kết bị xuống hàng ở Google Chrome
Cách đây vài ngày, Google Chrome cập nhật lên phiên bản mới nhất gây ra tình trạng website bị lỗi xuống hàng ở các liên kết gây ra cảm giác rất khó chịu và nhiều người lầm tưởng website của mình bị lỗi giao diện, ấy thế mà thật ra lỗi...
Tìm hiểu cách làm hiển thị Responsive cho website
Bài này chỉ nói qua Responsive nên các kiến thức cơ bản mình sẽ không nói qua, do vậy bạn cần chuẩn bị kiến thức HTML và CSS căn bản để có thể hiểu được trọn vẹn.
Responsive là gì?
Responsive là một tính từ để chỉ một website có thể hiển...
Tìm hiểu Prepros để biên dịch SASS, LESS, HAML…chuyên nghiệp
Prepros là một ứng dụng miễn phí (cũng có bản Pro) giúp chúng ta biên dịch các ngôn ngữ hỗ trợ viết CSS, HTML (hay còn gọi là Processor) để làm việc nhanh hơn. Nếu bạn đã từng biết qua LESS, SASS hay HAML thì đó là Processor, mình...
Tìm hiểu cách sử dụng SASS để viết CSS chuyên nghiệp
Khi viết CSS theo cách bình thường, có thể bạn đã chán ngán nhiều thao tác lặp đi lặp lại rất nhạt nhẽo, và bạn mong muốn có một cái gì đó hỗ trợ bạn làm việc với CSS chuyên nghiệp hơn. Nếu như bạn muốn đưa kiến thức CSS của mình lên một tầm...
Tổng kết serie CSS cơ bản
Với 25 bài trước trong serie CSS cơ bản, mình chắc chắn là bạn đã có một lượng kiến thức nhất định về CSS rồi phải không nè? Ít nhất là bạn đã hiểu được làm sao để chia cột website, làm thế nào mà phần tử này có thể đổi màu khi rê chuột vào, làm sao cái hộp này có thể...
Hướng dẫn cách thay đổi hình dạng với transform và transform-origin
Ngoài thuộc tính transition của CSS3 giúp bạn tạo ra các hiệu ứng chuyển động của các phần tử trong website, thì nó còn một thuộc tính khác được sử dụng kèm với transition rất thường xuyên đó là thuộc tính transform có chức...
Tìm hiểu cách tạo chuyển động với transition
Một trong các kỹ thuật phổ biến ở các website hiện đại là có các hiệu ứng chuyển động cho từng đối tượng rất đẹp mắt được làm hoàn toàn bằng CSS3, khi mà trước đây đa phần các hiệu ứng chuyển động phải cần có sự trợ giúp của Javascript. Trong CSS3 có...
Tìm hiểu CSS Framework và cách sử dụng
Qua các bài hướng dẫn CSS, chắc bạn cũng đã biết việc viết CSS từ đầu tới cuối cho các thành phần trong website rất gian nan và khá tốn công sức để có được một giao diện như ý muốn. Trong đó, có rất nhiều bước mà bạn phải làm đi làm lại đến chán nản. Vậy...
Hướng dẫn cách tạo layout đơn giản
Từ các kiến thức mà bạn đã biết được ở 21 phần trước trong serie CSS cơ bản, bạn có thể đã biết qua một số kỹ thuật cơ bản nhưng quan trọng nhất trong việc sử dụng CSS để thiết kế giao diện cho website. Vậy tại sao chúng ta lại không vận dụng tất cả để thực...
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...