1
00:00:00,000 --> 00:00:04,303
[MUSIC]

2
00:00:04,303 --> 00:00:06,765
Bây giờ chúng ta hãy nói về phông chữ biểu tượng.

3
00:00:06,765 --> 00:00:07,867
Họ là cái gì?

4
00:00:07,867 --> 00:00:09,284
Chúng hữu ích như thế nào?

5
00:00:09,284 --> 00:00:13,540
Và làm thế nào để chúng ta sử dụng chúng trong việc thiết kế trang web của chúng tôi?

6
00:00:13,540 --> 00:00:18,958
Phông chữ biểu tượng cung cấp một cách rất linh hoạt để bao gồm các

7
00:00:18,958 --> 00:00:24,732
hình ảnh nhỏ vào các trang web của chúng tôi có thể được tạo kiểu giống như văn bản.

8
00:00:24,732 --> 00:00:30,753
Vì vậy, đó là lý do phông chữ biểu tượng chứng minh rất,

9
00:00:30,753 --> 00:00:35,840
rất hữu ích trong việc thiết kế các trang web.

10
00:00:35,840 --> 00:00:40,290
Sử dụng phông chữ biểu tượng, bạn có thể lấy một trang web như thế này và

11
00:00:40,290 --> 00:00:44,270
nhanh chóng biến nó thành một trang web như thế này.

12
00:00:44,270 --> 00:00:50,381
Lưu ý việc sử dụng các biểu tượng cùng với văn bản trong thanh dẫn hướng,

13
00:00:50,381 --> 00:00:54,996
và sau đó khi bạn cuộn xuống chân trang,

14
00:00:54,996 --> 00:01:00,013
bạn có thể thấy nhiều biểu tượng được sử dụng trong chân trang.

15
00:01:00,013 --> 00:01:08,220
Và các liên kết truyền thông xã hội của bạn bây giờ được thay thế bằng các nút truyền thông xã hội ở đây.

16
00:01:08,220 --> 00:01:16,910
Vì vậy, đây là những thay đổi mà phông chữ biểu tượng sẽ cho phép bạn làm cho trang web của bạn.

17
00:01:16,910 --> 00:01:22,367
Vì vậy, như tôi đã đề cập ngắn gọn trước đó, phông chữ biểu tượng là một tập hợp các ký hiệu hoặc

18
00:01:22,367 --> 00:01:26,219
glyphs có thể được sử dụng trong thiết kế trang web của bạn.

19
00:01:26,219 --> 00:01:29,519
Chúng có thể được sử dụng giống như phông chữ thông thường,

20
00:01:29,519 --> 00:01:34,390
giống như phông chữ văn bản thông thường mà bạn sử dụng trong trang web của mình.

21
00:01:34,390 --> 00:01:38,953
Lợi thế của họ là bạn có thể phong cách chúng và

22
00:01:38,953 --> 00:01:43,876
sau đó mở rộng và hợp đồng chúng và sử dụng tất cả các

23
00:01:43,876 --> 00:01:49,657
kiểu dáng điển hình mà bạn sử dụng trên văn bản của bạn, cho các biểu tượng của bạn cũng.

24
00:01:49,657 --> 00:01:53,535
Chúng được xem như là một sự thay thế nhẹ phổ biến cho

25
00:01:53,535 --> 00:01:57,159
đồ họa đơn giản mà bạn có thể sử dụng trong các trang web của bạn,

26
00:01:57,159 --> 00:02:01,750
chỉ đơn giản là đồ họa hoặc hình ảnh mà bạn có thể sử dụng trong các trang web của bạn.

27
00:02:01,750 --> 00:02:07,290
Và chúng rất, rất hữu ích trong việc thiết kế các trang web của bạn.

28
00:02:07,290 --> 00:02:15,110
Có rất nhiều gói phông chữ biểu tượng có sẵn trên thị trường.

29
00:02:15,110 --> 00:02:18,180
Một trong những cái phổ biến nhất là Font Awesome,

30
00:02:18,180 --> 00:02:19,377
mà tôi sẽ nói về tiếp theo.

31
00:02:20,590 --> 00:02:24,850
Font Awesome, như tôi nói, là một phông chữ biểu tượng rất phổ biến.

32
00:02:24,850 --> 00:02:28,770
Nó có sẵn miễn phí để sử dụng trong việc thiết kế thiết kế trang của bạn.

33
00:02:28,770 --> 00:02:32,975
Nó đã được sử dụng rộng rãi bởi nhiều trang web khác nhau.

34
00:02:32,975 --> 00:02:37,580
Chúng ta sẽ tìm hiểu làm thế nào để tải về Font Awesome và

35
00:02:37,580 --> 00:02:42,940
sau đó sử dụng nó trong trang web trong bài tập sau bài giảng này.

36
00:02:44,180 --> 00:02:49,982
Sử dụng Font Awesome trong trang web của bạn là đơn giản như

37
00:02:49,982 --> 00:02:55,217
sử dụng một số lớp học được áp dụng cho một i,

38
00:02:55,217 --> 00:02:59,897
hoặc một thẻ span trong mã HTML trang web của bạn.

39
00:02:59,897 --> 00:03:02,480
Vì vậy, một khi bạn bao gồm CSS và

40
00:03:02,480 --> 00:03:07,440
các tập tin phông chữ có sẵn thông qua Font Awesome,

41
00:03:07,440 --> 00:03:13,860
sau đó nó là rất đơn giản để làm cho việc sử dụng Font Awesome trong các trang của bạn.

42
00:03:15,120 --> 00:03:20,491
Một tính năng phổ biến khác mà bạn sẽ thấy trên

43
00:03:20,491 --> 00:03:27,337
các trang web là việc sử dụng các nút trang web xã hội có như Facebook

44
00:03:27,337 --> 00:03:33,260
, Twitter, Google+ và YouTube và nhiều người khác.

45
00:03:34,530 --> 00:03:39,931
Bây giờ may mắn thay cho chúng tôi, có

46
00:03:39,931 --> 00:03:46,415
tập tin CSS khác được gọi là bootstrap-social mà bạn có thể tải về và

47
00:03:46,415 --> 00:03:50,873
sử dụng, bao gồm các

48
00:03:50,873 --> 00:03:55,346
nút trang web truyền thông xã hội khác nhau vào trang web của bạn.

49
00:03:55,346 --> 00:04:01,940
Chúng ta sẽ thấy việc sử dụng bootstrap-xã hội trong bài tập sau.

50
00:04:01,940 --> 00:04:06,532
Một khi bạn tải về tập tin css bootstrap-xã hội, bạn bao gồm trong trang web của bạn.

51
00:04:06,532 --> 00:04:11,385
Và sau đó cùng với các biểu tượng Font Awesome,

52
00:04:11,385 --> 00:04:16,604
bạn có thể kết hợp với các lớp học xã hội bootstrap

53
00:04:16,604 --> 00:04:22,688
để bao gồm các nút truyền thông xã hội khác nhau trên các trang web của bạn.

54
00:04:22,688 --> 00:04:27,834
Vì vậy, không có thêm ado, chúng ta hãy chuyển sang bài tập tiếp theo, nơi

55
00:04:27,834 --> 00:04:32,787
chúng ta sẽ sử dụng cả Font Awesome và bootstrap-xã hội,

56
00:04:32,787 --> 00:04:37,546
một phiên bản sửa đổi của bootstrap-social.css tập tin mà tôi

57
00:04:37,546 --> 00:04:42,984
cung cấp trên các hướng dẫn tập thể dục mà bạn nên tải về và

58
00:04:42,984 --> 00:04:48,647
bao gồm trong dự án nhầm lẫn của bạn và sử dụng của nó trong bài tập.

59
00:04:48,647 --> 00:04:54,639
[ NHẠC]