>> SPEAKER: Nó chỉ ra rằng HTML không phải là ngôn ngữ duy nhất mà bạn có thể sử dụng bên trong
của một trang web.
Bạn có thể sử dụng một cái gì đó gọi là CSS, hoặc Cascading Style Sheets, là tốt.
CSS cho phép bạn chỉ định nhiều hơn nữa chính xác tính thẩm mỹ của một trang web
trang, bao gồm bố trí và kích cỡ và màu sắc và phông chữ và nhiều hơn nữa.
Ví dụ, chúng ta hãy tạo ra một trang web đây gọi là CSS0 đại diện cho một
trang chủ cho, nói, John Harvard.
>> Trên trang này, chúng tôi sẽ có John Harvard tên, bên dưới sẽ được
một thông điệp tốt đẹp cho du khách của mình, bên dưới đó sẽ là một chân, với
nói, một số thông tin bản quyền.
Để làm điều này, hãy xác định ba đơn vị cho trang sử dụng một thẻ
gọi là div.
Mở khung div, John Harvard, gần khung div, một khung div mở,
và bây giờ chúng tôi sẽ chỉ định một cái gì đó như, chào mừng bạn đến trang chủ của tôi!
Và chúng ta hãy đóng div này, là tốt.
>> Và bây giờ là một thứ ba và cuối cùng div, bản quyền.
Chỉ được ưa thích, cho tôi sử dụng bây giờ là một HTML thực thể, một biểu tượng đại diện cho
một nhân vật mà bạn có thể không nếu không gõ trên bàn phím của bạn.
Trong đó, tôi sẽ làm ký hiệu, bảng Anh, 169, dấu chấm phẩy.
Hóa ra đó là mã số cho các biểu tượng bản quyền.
Sau đó, chúng ta hãy chỉ định John Harvard đây ở phía dưới.
Chúng ta hãy đóng div và lưu các tập tin.
>> Bây giờ, thẻ div này là gì?
Thẻ div chỉ đơn giản là định nghĩa một bộ phận của trang, mà chủ yếu là một
khu vực hình chữ nhật.
Vì vậy, tại thời điểm này trong thời gian, tôi có ba khu vực hình chữ nhật, một trong những ngày đầu
của người khác.
Vì vậy, hiện nay, hiệu quả là gần như là mặc dù tôi đã có ba đoạn.
Nhưng chúng ta sẽ không nhìn thấy khá nhiều không gian màu trắng ở giữa chúng.
>> Hãy lưu tập tin này, thay đổi của nó quyền, và có một cái nhìn cho một
thời điểm trong Chrome.
Chmod a + r CSS0.html.
Hãy bây giờ mở Chrome và truy cập http://localhost.CSS0.html.
Thật vậy, đây là một trang chủ John Harvard.
Bây giờ chúng ta phong cách hóa nó nhiều hơn một chút chính xác sử dụng một số CSS.
>> Trở lại trong gedit, chúng ta hãy đi vào này thẻ div đầu tiên và thêm một phong cách
thuộc tính xác định rằng tôi muốn một cỡ chữ, nói rằng, 36 điểm ảnh, hoặc px.
Và tôi muốn trọng lượng của phông chữ này được in đậm thay vì mặc định,
đó là bình thường.
Cho div thứ hai, chúng ta hãy xác định một thuộc tính phong cách mà có một
cỡ chữ 24 pixel, vì vậy một chút nhỏ hơn.
Đóng dấu ngoặc kép sau dấu chấm phẩy.
>> Cuối cùng, trong div thứ ba này, chúng ta hãy làm phong cách bằng kích thước giá, phông chữ, và
chúng ta hãy nói 12 pixels thời gian này.
Gần quote sau dấu chấm phẩy.
Chú ý rằng sau đó tôi dường như có quy định một chút cách điệu cho
mỗi ba divs sử dụng, Hóa ra, CSS.
Trong thực tế, cú pháp mà bạn nhìn thấy trong giữa các dấu ngoặc kép là CSS,
đặc biệt CSS tính với các giá trị.
Và cho rằng thẻ đầu tiên, nơi mà tôi đã hai tài sản đó, cỡ chữ và
trọng lượng font chữ, tôi chỉ đơn giản là tách ra chúng với một dấu chấm phẩy.
>> Bây giờ, chỉ vì phong cách, tôi cũng bao gồm dấu chấm phẩy ở
cuối mỗi dòng.
Nhưng họ không thực sự cần thiết, đặc biệt là khi bạn chỉ có một
tài sản quy định.
Bây giờ hãy lưu các tập tin và tải lại trong Chrome, và xem những gì
ảnh hưởng thực là.
Trở lại trong Chrome đây, hãy nhấn Reload.
>> Bây giờ chúng tôi có một thú vị hơn một chút trang chủ cho John
Harvard, theo đó dòng đầu tiên với tên của mình, đó là bên trong đó
div đầu tiên, cao 36 pixel và cũng đậm, trong đó dòng thứ hai,
mà là ở chỗ div thứ hai, là 24 pixel cao, nhưng không đậm.
Và theo đó dòng thứ ba trong thứ ba div là cao 12 pixel và cũng
không in đậm.
Nhưng giả sử bây giờ tôi muốn chuyển tất cả các văn bản này trên
như vậy mà nó làm trung tâm.
>> Tôi có thể sắp xếp mỗi cá nhân divs như được làm trung tâm.
Nhưng dễ dàng hơn, tôi có thể bọc những ba divs bên trong của một div thứ tư, một
div cha mẹ, vậy để nói chuyện, và chỉ định rằng div và tất cả của nó
con cháu nên văn bản liên kết trung tâm?
Chúng ta hãy có một cái nhìn.
>> Bên trong gedit, chúng ta hãy quay trở lại của tôi cơ thể và thêm một div mới lên hàng đầu với
div, phong cách bằng quote unquote trung tâm căn chỉnh văn bản, gần
giá sau dấu chấm phẩy.
Và bây giờ, chúng ta hãy đi trước và thụt tất cả của các dòng chúng tôi gõ trước.
Và dưới đây là div thứ ba, chúng ta hãy đóng div mới này.
>> Nói cách khác, bởi vì những ba divs ban đầu bây giờ là trẻ em, do đó, để
nói, trong một div cha mẹ mới và tôi đã xác định rằng tôi muốn sắp xếp các
văn bản đó div cha mẹ trong trung tâm trang, bất động sản sẽ được
kế thừa tất cả những trẻ em.
Thật vậy, chúng ta hãy lưu các tập tin và Hãy xem trong một trình duyệt.
Hãy tải lại trong Chrome.
Và chúng tôi đã có nó, một thậm chí đẹp hơn trang chủ cho John Harvard.