# 041: Xây dựng quảng cáo trên ngôi nhà trên cây, Phần 2 - Thủ thuật CSS

Anonim

Chúng tôi có đánh dấu cho quảng cáo Treehouse trên đầu trang, nhưng chúng tôi có một số công việc tạo kiểu dáng phải làm. Chúng tôi bắt đầu với đồ họa cây.

Chúng tôi nghĩ rằng việc sử dụng vectơ và kết xuất dưới dạng SVG có thể thú vị vì nó trông sắc nét và có kích thước tệp nhỏ. Xem tôi loanh quanh trong Illustrator cố gắng có được một phiên bản sạch đẹp của nó trong tất cả các vector và cuối cùng thất bại. Bây giờ chúng tôi quyết định quên nó đi và chỉ biến nó thành một hình ảnh.

Hóa ra, Treehouse không sử dụng thương hiệu đó nữa, vì vậy tôi sẽ cần sớm cập nhật nó và chắc chắn tôi sẽ dành thời gian để biến nó thành SVG, ngay cả khi tôi phải vẽ lại.

Hiện tại, chúng tôi tạo PNG và đưa nó vào thiết kế với nền CSS. Chúng tôi giảm kích thước nó xuống với kích thước nền (mặc dù tôi đã nhầm lẫn một lần nữa khi sử dụng tỷ lệ phần trăm - hãy nhớ khi bạn sử dụng tỷ lệ phần trăm, nó là phần trăm của phần tử không phải là phần trăm của kích thước của chính hình ảnh).

Chúng tôi nhận được màu sắc và kích thước và định vị tất cả các thiết lập. Bây giờ, bước cuối cùng là làm cho nó hoạt động trong thiết kế đáp ứng.