Xin chào tất cả mọi người quay lại.
Đã đến lúc chúng ta bắt đầu mã hóa.
Một trong những điều tôi nhận thấy trong vài năm qua giảng dạy
là học sinh thực sự khác biệt về cách họ nhảy vào và
xử lý các loại khác nhau của các lớp lập trình.
Một số sẽ ngồi xuống máy tính, không bao giờ đọc cuốn sách và chỉ hack,
và hack, và hack.
Một số bạn có thể hơi tội lỗi khi làm tất cả các bài đọc, lắng nghe tất cả
các bài giảng, nhưng không bao giờ thực sự thử bất cứ điều gì chúng ta đã nói đến.
Vì vậy, đó là những gì các bài tập về nhà là để làm.
Một cơ hội để bạn cuối cùng đi qua và đặt xuống một số mã này và
xem những gì xảy ra khi bạn cố gắng áp dụng kiểu dáng cho HTML của bạn.
Vì vậy, mục tiêu cho bài tập về nhà này là cho bạn để cho tôi thấy rằng bạn
có thể viết một tập tin CSS có thể đi và phong cách ba tập tin HTML khác nhau.
Tôi sẽ cho các bạn xem vài ví dụ về
nhiệm vụ này trước và sau của chúng tôi.
Tôi đã đặt các liên kết ở đây ở bên cạnh, nhưng
nó sẽ thực sự rõ ràng hơn nhiều khi tôi cho bạn thấy bài tập về nhà trong hành động.
Vì vậy, chúng ta hãy nhìn vào nó.
Khi chúng ta bắt đầu,
tôi sẽ cung cấp cho bạn ba tập tin HTML mà thực sự không được phong cách tốt.
Họ bắt đầu,
họ có một điều hướng, họ có ba bức ảnh rất lớn, một số là nhỏ hơn.
Và sau đó họ có nội dung.
Tất cả ba trang mà bạn sẽ xem, nhà, nhóm và lịch sử đều có nội dung khác nhau.
Những gì tôi muốn bạn làm là viết các quy tắc CSS của riêng bạn sẽ lấy
những loại trang này, và biến nó thành một cái gì đó trông như thế này.
Bây giờ, tôi biết đây không phải là một bước nhảy lớn, nhưng
đây chính xác là cách tôi muốn bạn bắt đầu lập trình.
Tôi muốn bạn thực hiện những thay đổi nhỏ và gia tăng có thể đưa bạn từ thứ
gì đó khó đọc đến thứ gì đó dễ đọc hơn.
Vì vậy, chúng ta hãy đi trước và bước qua những điều khác nhau mà bạn sẽ cần phải
thay đổi để đạt được cái nhìn riêng biệt này.
Điều quan trọng nhất cần hiểu là bạn phải để lại HTML một mình.
Tôi không muốn bạn thay đổi nó ở tất cả,
thay vào đó tôi chỉ muốn bạn tạo kiểu mọi thứ và chỉnh sửa mọi thứ trong bảng kiểu dáng.
Và những thứ mà bạn cần phải thêm là phong cách cho
tiêu đề, tiêu đề, phần, liên kết và hình ảnh.
Vì vậy, để tôi đi qua và cho các bạn thấy chính xác những gì bạn cần phải nhìn vào.
Đối với tiêu đề của bạn, nó khá đơn giản.
Tôi muốn bạn vào và tôi muốn bạn thêm một màu nền.
Đối với các tiêu đề của bạn, cả h1 và h2, tôi muốn bạn thay đổi màu phông chữ.
Bây giờ hãy nhớ, điều này khác với màu nền.
Đó là màu sắc mà văn bản hiển thị trong.
Tiếp theo, tôi muốn bạn đảm bảo rằng tất cả các tiêu đề được hiển thị bằng chữ hoa.
Vì vậy, nếu anh quay lại, chúng tôi sẽ xem xét nhanh.
Bạn có thể thấy rằng đồng hồ đầu của bạn và frisbee cuối cùng là chữ hoa,
trong khi trong phiên bản HTML gốc, chúng ở chữ thường.
Vì vậy, tôi muốn bạn sử dụng CSS để thực hiện thay đổi đó.
Điều tiếp theo tôi muốn bạn làm là chỉ dành cho
tiêu đề h1 Tôi muốn bạn tập trung văn bản.
Tiếp theo thực hiện một thay đổi nhanh chóng cho phần của HTML của bạn.
Tôi muốn bạn tạo kiểu cho phần khác nhau để
nó có một màu nền khác nhau từ các yếu tố khác trong trang của bạn.
Tiếp theo, chúng ta hãy xem các liên kết.
Những thay đổi anh sẽ thực hiện ở đây rất tinh tế.
Họ không rõ ràng lắm nếu tôi không nói cho anh biết những gì
anh đang tìm kiếm.
Và những gì tôi muốn bạn làm là tôi muốn bạn thay đổi màu nền, và
màu phông chữ, cho các liên kết của bạn.
Sau khi bạn đã thực hiện điều đó, đi vào và trung tâm văn bản,
tương tự như cách bạn đang đi đến trung tâm văn bản cho các tiêu đề h1.
Cuối cùng, điều cuối cùng mà thực sự kinda lộn lên ví dụ ban đầu trang HTML của chúng tôi là
những hình ảnh khổng lồ mà chỉ nhận được trong cách.
Vì vậy, ngay bây giờ, vì chúng tôi đã không nói về cách tốt nhất để tạo kiểu hình ảnh,
tôi muốn bạn chỉ cần xóa chúng khỏi trang.
Nhưng hãy nhớ rằng, đây có thể là phần khó khăn nhất của toàn bộ nhiệm vụ bởi vì tôi
không muốn bạn thay đổi html.
Tôi muốn những bức ảnh đó có mặt ở đó.
Tôi chỉ muốn bạn sử dụng CSS3 để loại bỏ chúng khỏi trang.
Vì vậy, tôi hy vọng giữa việc xem qua ví dụ này và nhìn trực tuyến, và nhìn vào
trước và sau khi chụp, rằng bạn sẽ có thể thực hiện bài tập về nhà này.
Khi anh làm xong, chúng tôi sẽ sử dụng chấm điểm ngang hàng.
Khi chúng ta làm việc này, điểm số sẽ dựa trên cơ bản là anh có thể
hoàn thành những gì chúng ta đang làm.
Khi tôi nói về thẩm mỹ,
tôi đang nói về bạn đã chọn màu nền khá và màu phông chữ.
Chúng tôi thực sự không quan tâm đến chuyện này.
Đây là bài tập đầu tiên của chúng tôi.
Tôi thực sự chỉ muốn bạn cảm thấy chỉ thành công.
Tuy nhiên, các tiêu chuẩn thích hợp sẽ được áp dụng.
Và điều tôi muốn nói là không sử dụng tên màu, sử dụng hệ thập lục phân hoặc
RGB, và không đặt tất cả các quy tắc của bạn lên một dòng.
Hãy chắc chắn rằng bảng kiểu CSS của bạn dễ đọc.
Khác với các phong cách mà tôi liệt kê xin vui lòng không thay đổi những thứ khác cho ngay bây giờ.
Nó làm cho nó khó khăn hơn nhiều để phân loại.
Nhưng đừng lo.
Khi chúng tôi trải qua khóa học này, bạn sẽ có cơ hội để đặt trong
vẻ ngoài độc đáo của riêng bạn như các yếu tố phong cách của bạn.
Bây giờ tất cả những gì tôi có thể nói là chúc may mắn và
chắc chắn rằng bạn sẽ đi vào các bảng thảo luận nếu bạn có bất kỳ câu hỏi nào.