-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy paththuoctinhcss.html
820 lines (799 loc) · 32.8 KB
/
thuoctinhcss.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>F-Learn</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="icon" href="images/iconweb.png" type="image/gif" sizes="16x16">
</head>
<body>
<div class="container">
<div class="header">
<div class="logo">
<a href="index.html" onclick="location.reload();">
<img src="images/logo-unscreen.gif">
</a>
</div>
<div class="menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="cacthetronghtml.html">HTMS & CSS</a></li>
<li><a href="tools.html">Tools</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="dangky.html">Đăng Kí</a></li>
</ul>
</div>
</div>
<div class="banner">
<img src="images/banner.png" />
</div>
<div class="content">
<div class= "left">
<h1>Overview CSS</h1>
<div class="title">
<marquee> Color properties</marquee>
</div>
<br>
<div class="description">
<span><b>color</b>: Đặt màu sắc cho đoạn văn bản.</span>
<br>
<br>
<span><b>opacity</b>: Đặt mức độ trong suốt cho một phần tử nào đó.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Background and Border properties</marquee>
</div>
<div class="description">
<span><b>background</b>: Một thuộc tính viết tắt để đặt thuộc tính nền trong lời khai báo.</span>
<br>
<br>
<span><b>background-attachment</b>: Đặt một ảnh nền để cố định hoặc cuộn với phần còn lại của trang.</span>
<br>
<br>
<span><b>background-blend-mode</b>: Chỉ định các chế độ trộn của mỗi lớp nền(màu sắc/hình ảnh)</span>
<br>
<br>
<span><b>background-color</b>: Chỉ định màu nền của một phần tử.</span>
<br>
<br>
<span><b>background-image</b>: Chỉ định một hoặc nhiều hình ảnh nền cho một phần tử.</span>
<br>
<br>
<span><b>background-position</b>: Chỉ định vị trí của hình ảnh nền.</span>
<br>
<br>
<span><b>background-repeat</b>: Thiết lập như thế nào một ảnh nền sẽ được lặp đi lặp lại.</span>
<br>
<br>
<span><b>background-clip</b>: Chỉ định khu vực để sơn màu nền.</span>
<br>
<br>
<span><b>background-origin</b>: Chỉ định nơi các hình nền được định vị.</span>
<br>
<br>
<span><b>background-size</b>: Chỉ định kích thước của ảnh nền.</span>
<br>
<br>
<span><b>border</b>: Thiết lập tất cả các thuộc tính đường viền trong lời khai báo.</span>
<br>
<br>
<span><b>border-bottom</b>: Thiết lập tất cả các thuộc tính đường viền dưới trong lời khai báo.</span>
<br>
<br>
<span><b>border-bottom-color</b>: Thiết lập màu của đường viền dưới.</span>
<br>
<br>
<span><b>border-bottom-left-radius</b>: Xác định hình dạng của các đường viền góc dưới bên trái.</span>
<br>
<br>
<span><b>border-bottom-right-radius</b>: Xác định hình dạng của các đường viền góc dưới bên phải.</span>
<br>
<br>
<span><b>border-bottom-style</b>: Thiết lập kiểu (style) của đường viền dưới.</span>
<br>
<br>
<span><b>border-bottom-width</b>: Thiết lập độ rộng của đường viền dưới.</span>
<br>
<br>
<span><b>border-color</b>: Thiết lập màu sắc của bốn đường viền.</span>
<br>
<br>
<span><b>border-image</b>: Một thuộc tính viết tắt để thiết lập tất cả các thuộc tính border-image-* .</span>
<br>
<br>
<span><b>border-image-outset</b>: Chỉ định giá trị khu vực ảnh viền vượt ra ngoài vùng giới hạn của vùng bao.</span>
<br>
<br>
<span><b>border-image-repeat</b>: Chỉ định ảnh viền nên được lặp đi lặp lại, tròn hoặc kéo dài.</span>
<br>
<br>
<span><b>border-image-slice</b>: Chỉ định cụ thể như thế nào để cắt ảnh viền.</span>
<br>
<br>
<span><b>border-image-source</b>: Chỉ định đường dẫn tới hình ảnh để sử dụng như đường viền.</span>
<br>
<br>
<span><b>border-image-width</b>: Chỉ định độ rộng của ảnh-viền.</span>
<br>
<br>
<span><b>border-left</b>: Thiết lập tất cả thuộc tính đường viền trái trong lời khai báo.</span>
<br>
<br>
<span><b>border-left-color</b>: Thiết lập màu sắc của đường viền trái.</span>
<br>
<br>
<span><b>border-left-style</b>:Thiết lập kiểu ( style) của đường viền trái.</span>
<br>
<br>
<span><b>border-left-width</b>: Thiết lập độ rộng của đường viền trái</span>
<br>
<br>
<span><b>border-radius</b>: Thuộc tính viết tắt để thiết lập tất cả bốn đường viền-*-thuộc tính radius(bán kính).</span>
<br>
<br>
<span><b>border-right</b>: Thiết lập thuộc tính đường viền phải trong lời khai báo.</span>
<br>
<br>
<span><b>border-right-color</b>: Thiết lập màu sắc cho đường viền phải.</span>
<br>
<br>
<span><b>border-right-style</b>: Thiết lập kiểu (style) cho đường viền phải.</span>
<br>
<br>
<span><b>border-right-width</b>: Thiết lập độ rộng cho đường viền phải.</span>
<br>
<br>
<span><b>border-style</b>: Thiết lập kiểu (style) cho bốn đường viền .</span>
<br>
<br>
<span><b>border-top</b>: Thiết lập thuộc tính đường viền trên trong lời khai báo.</span>
<br>
<br>
<span><b>border-top-color</b>: Thiết lập màu sắc cho đường viền trên.</span>
<br>
<br>
<span><b>border-top-left-radius</b>: Xác định hình dạng của đường viền góc trên bên trái.</span>
<br>
<br>
<span><b>border-top-right-radius</b>: Xác định hình dạng của đường viền góc trên bên phải.</span>
<br>
<br>
<span><b>border-top-style</b>: Thiết lập kiểu (style) cho đường viền trên.</span>
<br>
<br>
<span><b>border-top-width</b>: Thiết lập độ rộng của đường viền trên.</span>
<br>
<br>
<span><b>border-width</b>: Thiết lập độ rộng của bốn đường viền.</span>
<br>
<br>
<span><b>box-decoration-break</b>: Thiết lập dáng vẻ của hình nền và đường viền của một phần tử tại trang ngắt, hoặc đối với phần tử in-line , tại dòng ngắt.</span>
<br>
<br>
<span><b>box-shadow</b>: Gắn một hoặc nhiều đổ bóng (drop-shadows) vào hộp.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Basic Box properties</marquee>
</div>
<div class="description">
<span><b>bottom</b>: Xác định vị trí cuối của phần tử position (vị trí).</span>
<br>
<br>
<span><b>clear</b>: Xác định hai bên của phần tử (left,right) nơi mà phần tử float không được cho phép (ngăn cản thành phần không được float trái, phải hay cả hai).</span>
<br>
<br>
<span><b>clip</b>: Xác định đoạn cho phần tử khi sử dụng thuộc tính position có giá trị “absolute".</span>
<br>
<br>
<span><b>display</b>: Chỉ định làm thế nào một phần tử HTML nào đó sẽ được hiển thị.</span>
<br>
<br>
<span><b>float</b>: Xác định có hay không một box được float(trôi nổi).</span>
<br>
<br>
<span><b>height</b>: Thiết lập chiều cao của thành phần.</span>
<br>
<br>
<span><b>left</b>: Xác định vị trí bên trái của phần tử position.</span>
<br>
<br>
<span><b>margin</b>: Thiết lập thuộc tính margin (căn lề cho phần tử) trong một thông báo.</span>
<br>
<br>
<span><b>margin-bottom</b>: Thiết lập lề dưới của một phần tử.</span>
<br>
<br>
<span><b>margin-left</b>: Thiết lập lề trái của một phần tử.</span>
<br>
<br>
<span><b>margin-right</b>: Thiết lập lề phải của một phần tử.</span>
<br>
<br>
<span><b>margin-top</b>: Thiết lập lề trên của một phần tử.</span>
<br>
<br>
<span><b>max-height</b>: Thiết lập chiều cao tối đa của một phần tử.</span>
<br>
<br>
<span><b>max-width</b>: Thiết lập chiều rộng tối đa của một phần tử.</span>
<br>
<br>
<span><b>min-height</b>: Thiết lập chiều cao tối thiểu của một phần tử.</span>
<br>
<br>
<span><b>min-width</b>: Thiết lập chiều rộng tối thiểu của một phần tử.</span>
<br>
<br>
<span><b>overflow</b>: Chỉ định những gì sẽ xảy ra nếu nội dung tràn ra ngoài phần tử hộp.</span>
<br>
<br>
<span><b>overflow-x</b>: Xác định có hay không để cắt cạnh trái/phải của đoạn văn bản, nếu nó tràn ra khỏi khu vực nội dung của phần tử.</span>
<br>
<br>
<span><b>overflow-y</b>: Xác định có hay không để cắt cạnh trên /dưới của đoạn văn bản, nếu nó tràn ra khỏi khu vực nội dung của phần tử.</span>
<br>
<br>
<span><b>padding</b>: Thiết lập lại thuộc tính padding (vùng đệm) trong lời khai báo.</span>
<br>
<br>
<span><b>padding-bottom</b>: Thiết lập vùng đệm dưới của phần tử.</span>
<br>
<br>
<span><b>padding-left</b>: Thiết lập vùng đệm trái của một phần tử.</span>
<br>
<br>
<span><b>padding-right</b>: Thiết lập vùng đệm phải của một phần tử.</span>
<br>
<br>
<span><b>padding-top</b>: Thiết lập vùng đệm trên của một phần tử.</span>
<br>
<br>
<span><b>position</b>: Xác định kiểu của phương thức định vị được sử dụng cho một phần tử (static, relative, absolute or fixed).</span>
<br>
<br>
<span><b>right</b>: Xác định vị trí phải của phần tử position.</span>
<br>
<br>
<span><b>top</b>: Xác định vị trí trên của phần tử position.</span>
<br>
<br>
<span><b>visibility</b>: Xác định có hay không một phần tử có thể nhìn thấy được.</span>
<br>
<br>
<span><b>width</b>: Thiết lập độ rộng của phần tử.</span>
<br>
<br>
<span><b>vertical-align</b>: Sắp xếp nội dung theo chiều dọc của phần tử.</span>
<br>
<br>
<span><b>z-index</b>Thiết lập thứ tự xếp chồng nhau của phần tử position.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Properties for Flexible Box layout</marquee>
</div>
<div class="description">
<span><b>align-content</b>: Xác định sự căn chỉnh giữa các dòng bên trong một khối linh hoạt ( flexible container) khi các mục không sử dụng các khoảng cách có sẵn.</span>
<br>
<br>
<span><b>align-items</b>: Xác định sự căn chỉnh cho các mục bên trong một khối linh hoạt ( flexible container).</span>
<br>
<br>
<span><b>align-self</b>: Xác định sự căn chỉnh cho các mục được chọn bên trong một khối linh hoạt ( flexible container)</span>
<br>
<br>
<span><b>flex</b>: Xác định độ dài của các mục, tương đối với phần còn lại.</span>
<br>
<br>
<span><b>flex-basis</b>: Xác định độ dài ban đầu của một mục linh hoạt (flexible item).</span>
<br>
<br>
<span><b>flex-direction</b>: Xác định hướng của các mục linh hoạt (flexible items).</span>
<br>
<br>
<span><b>flex-flow</b>: Một thuộc tính viết tắt cho thuộc tính flex-direction và flex-wrap.</span>
<br>
<br>
<span><b>flex-grow</b>: Chỉ định bao nhiêu mục sẽ tăng tương đối so với phần còn lại.</span>
<br>
<br>
<span><b>flex-shrink</b>: Chỉ định bao nhiêu mục sẽ giảm tương đối so với phần còn lại.</span>
<br>
<br>
<span><b>flex-wrap</b>: Chỉ định liệu các mục linh hoạt (flexible items) nên bọc hay không.</span>
<br>
<br>
<span><b>justify-content</b>: Xác định sự căn chỉnh giữa các mục bên trong một khối linh hoạt (flexible container) khi các mục không sử dụng tất cả các khoảng cách có sẵn.</span>
<br>
<br>
<span><b>order</b>: Thiết lập thứ tự của các mục linh hoạt (flexible items), tương đối so với phần còn lại.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Text properties</marquee>
</div>
<div class="description">
<span><b>hanging-punctuation</b>: Xác định ký tự chấm câu có thể được đặt ở ngoài đường hộp.</span>
<br>
<br>
<span><b>hyphens</b>: Thiết lập làm thế nào tách từ để cải thiện cách bố trí của đoạn văn.</span>
<br>
<br>
<span><b>letter-spacing</b>: Tăng hoặc giảm khoảng cách giữa các ký tự trong một văn bản.</span>
<br>
<br>
<span><b>line-break</b>: Xác định cách ngắt dòng.</span>
<br>
<br>
<span><b>line-height</b>: Thiết lập chiều cao của dòng.</span>
<br>
<br>
<span><b>overflow-wrap</b>: Xác định có hay không trình duyệt có thể ngắt dòng trong các từ để ngăn cản việc tràn (Khi một chuỗi quá dài để phù hợp với hộp chứa nó.</span>
<br>
<br>
<span><b>tab-size</b>: Xác định chiều dài của các kí tự tab.</span>
<br>
<br>
<span><b>text-align</b>: Xác định căn chỉnh nội dung theo chiều ngang.</span>
<br>
<br>
<span><b>text-align-last</b>: Mô tả cách dòng cuối cùng của mộtđoạn hoặc một dòng ngay trước khi một ngắt dòng là căn chỉnh khi text-align là “justify”.</span>
<br>
<br>
<span><b>text-combine-upright</b>: Xác định sự kết hợp của đa ký tự vào khoảng cách của một ký tự đơn.</span>
<br>
<br>
<span><b>text-indent</b>: Xác định rõ sự thụt dòng đầu tiên trong một khối văn bản.</span>
<br>
<br>
<span><b>text-justify</b>: Xác định phương pháp căn lề thẳng hàng hai bên sử dụng khi text-align là “justify”.</span>
<br>
<br>
<span><b>text-transform</b>: Điều khiển các chữ in hoa.</span>
<br>
<br>
<span><b>white-space</b>: Xác định cách mà khoảng trắng bên trong một phần tử được xử lý.</span>
<br>
<br>
<span><b>word-break</b>: Xác định quy tắc ngắt dòng đối với scripts non-CJK.</span>
<br>
<br>
<span><b>word-spacing</b>: Tăng hoặc giảm khoảng cách giữa các từ trong đoạn văn.</span>
<br>
<br>
<span><b>word-wrap</b>: Cho phép dài, những từ dài được xuống hàng mà không làm vỡ layout.</span>
<br>
<br>
</div>
<div class="title">
<marquee> Các thuộc tính Text Decoration</marquee>
</div>
<div class="description">
<span><b>text-decoration</b>: Xác định các trang trí thêm vào văn bản.</span>
<br>
<br>
<span><b>text-decoration-color</b>: Xác định màu của văn bản trang trí (text-decoration).</span>
<br>
<br>
<span><b>text-decoration-line</b>: Xác định loại của dòng trong text-decoration.</span>
<br>
<br>
<span><b>text-decoration-style</b>: Xác định kiểu của các dòng trong một văn bản trang trí.</span>
<br>
<br>
<span><b>text-shadow</b>: Thêm đổ bóng cho văn bản.</span>
<br>
<br>
<span><b>text-underline-position</b>: Xác định vị trí của các gạch dưới được thiết lập bằng cách sử dụng thuộc tính text-decoration.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Font</marquee>
</div>
<div class="description">
<span><b>@font-face</b>: Một quy tắc cho phép các trang web tải và sử dụng các phông chữ khác với phông chữ “web-safe”.</span>
<br>
<br>
<span><b>@font-feature-values</b>: Cho phép tác giả sử dụng một tên chung trong font-variant-alternate đối với tính năng kích hoạt khác nhau trong OpenType.</span>
<br>
<br>
<span><b>font</b>: Đặt tất cả các thuộc tính font trong lời khai báo.</span>
<br>
<br>
<span><b>font-family</b>: Xác định họ phông chữ cho văn bản.</span>
<br>
<br>
<span><b>font-feature-settings</b>: Cho phép kiểm soát các tính năng về in tiên tiến trong OpenType fonts.</span>
<br>
<br>
<span><b>font-kerning</b>: Kiểm soát việc sử dụng các thông tin kerning (cách các từ cách nhau).</span>
<br>
<br>
<span><b>font-language-override</b>: Kiểm soát việc sử dụng của ngôn ngữ cụ thể nét trạm (language-specific glyphs) trong kiểu chữ.</span>
<br>
<br>
<span><b>font-size</b>: Xác định kích thước phông chữ của đoạn văn.</span>
<br>
<br>
<span><b>font-size-adjust</b>: Duy trì khả năng đọc văn bản khi phông chữ dự phòng xuất hiện.</span>
<br>
<br>
<span><b>font-stretch</b>: Chọn kiểu normal, condensed,hoặc expanded từ họ phông chữ.</span>
<br>
<br>
<span><b>font-style</b>: Xác định kiểu chữ cho văn bản.</span>
<br>
<br>
<span><b>font-synthesis</b>: Quản lí các kiểu chữ (đậm hoặc nghiêng) có thể được tổng hợp bởi trình duyệt.</span>
<br>
<br>
<span><b>font-variant</b>: Xác định có hay không một văn bản được hiển thị với phông chữ small-caps.</span>
<br>
<br>
<span><b>font-variant-alternates</b>: Kiểm soát việc sử dụng các nét chạm thay thế liên quan đến việc thay tên được định nghĩa trong @font-feature-values.</span>
<br>
<br>
<span><b>font-variant-caps</b>: Kiểm soát việc sử dụng nét chạm (glyph)thay thế cho chữ in hoa.</span>
<br>
<br>
<span><b>font-variant-east-asian</b>: Kiểm soát việc sử dụng nét chạm (glyph ) thay thế cho các kịch bản Đông Á (ví dụ như Trung Quốc và Nhật Bản).</span>
<br>
<br>
<span><b>font-variant-ligatures</b>:Kiểm soát các chữ ghép và các biểu mẫu theo ngữ cảnh được sử dụng trong các nội dung văn bản của phần tử mà nó được áp dụng.</span>
<br>
<br>
<span><b>font-variant-numeric</b>: Kiểm soát việc sử dụng các họa tiết (glyph) thay thế cho số, phân số và đánh dấu thứ tự.</span>
<br>
<br>
<span><b>font-variant-position</b>: Kiểm soát việc sử dụng các họa tiết thay thế kích thước nhỏ hơn vị trí như là chỉ số trên hoặc chỉ số dưới về đường cơ sở của các phông chữ.</span>
<br>
<br>
<span><b>font-weight</b>: Xác định độ đậm của phông chữ.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Writing Modes</marquee>
</div>
<div class="description">
<span><b>direction</b>: Xác định hướng văn bản/ hướng bài viết.</span>
<br>
<br>
<span><b>text-orientation</b>: Xác định hướng của văn bản trong một dòng.</span>
<br>
<br>
<span><b>text-combine-upright</b>: Xác định sự kết hợp của đa ký tự vào khoảng cách của ký tự đơn.</span>
<br>
<br>
<span><b>unicode-bidi</b>: Được sử dụng cùng với thuộc tính direction để đặt và trả về cho dù văn bản nên được ghi đè để hỗ trợ nhiều ngôn ngữ trong cùng một tài liệu.</span>
<br>
<br>
<span><b>writing-mode</b>: Xác định liệu dòng văn bản được đặt ra theo chiều ngang hay chiều dọc hay hướng mà khối tiến tới.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Table</marquee>
</div>
<div class="description">
<span><b>border-collapse</b>: Xác định liệu có hay không đường viền của bảng nên tách biệt.</span>
<br>
<br>
<span><b>border-spacing</b>: Xác định khoảng cách giữa đường viền của các ô lân cận.</span>
<br>
<br>
<span><b>caption-side</b>: Xác định vị trí của một chú thích bảng.</span>
<br>
<br>
<span><b>empty-cells</b>: Xác định có hay không để hiển thị đường viền và nền trên ô trống trong một bảng.</span>
<br>
<br>
<span><b>table-layout</b>: Thiết lập thuật toán bố trí (layout algorithm) được sử dụng cho bảng.</span>
<br>
<br>
</div>
<div class="title">
<marquee> Các thuộc tính Lists và Counters</marquee>
</div>
<div class="description">
<span><b>counter-increment</b>: Gia tăng một hoặc nhiều counters.</span>
<br>
<br>
<span><b>counter-reset</b>: Tạo hoặc thiết lập lại một hay nhiều counters.</span>
<br>
<br>
<span><b>list-style</b>: Thiết lập tất cả các thuộc tính cho danh sách trong lời khai báo.</span>
<br>
<br>
<span><b>list-style-image</b>: Xác định một hình ảnh như đánh dấu mục danh sách.</span>
<br>
<br>
<span><b>list-style-position</b>: Xác định nếu đánh danh mục sẽ xuất hiện bên trong hoặc bên ngoài nội dung.</span>
<br>
<br>
<span><b>list-style-type </b>: Xác định loại của đánh dấu danh mục.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Animation</marquee>
</div>
<div class="description">
<span><b>@keyframes</b>: Xác định mã animation.</span>
<br>
<br>
<span><b>animation</b>: Một thuộc tính viết tắt cho các thuộc tính animation (ngoại trừ animation-play-state và animation-fill-mode.</span>
<br>
<br>
<span><b>animation-delay</b>: Xác định sự chậm trễ đối với sự bắt đầu của một chuyển động của hình ảnh hoặc tag (animation).</span>
<br>
<br>
<span><b>animation-direction</b>: Xác định có hay không các chuyển động nên chạy ngược lại trên chu kỳ thay thế.</span>
<br>
<br>
<span><b>animation-duration</b>: Xác định có bao nhiêu giây hoặc mili giây một chuyển động cần để hoàn thành một chu kỳ.</span>
<br>
<br>
<span><b>animation-fill-mode</b>: Xác định kiểu cho các phần tử khi các chuyển động không chạy (Khi nó dừng lại , hoặc khi nó bị trễ).</span>
<br>
<br>
<span><b>animation-iteration-count</b>: Xác định số lần một chuyển động được thực hiện.</span>
<br>
<br>
<span><b>animation-name</b>: Xác định tên của @keyframes animation.</span>
<br>
<br>
<span><b>animation-play-state</b>: Xác định xem các chuyển động đang được chạy hay tạm dừng.</span>
<br>
<br>
<span><b>animation-timing-function</b>: Xác định tốc độ cong của một chuyển động của hình ảnh hoặc tag.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Transform</marquee>
</div>
<div class="description">
<span><b>backface-visibility</b>: Xác định có hay không một phần tử nên được nhìn thấy khi không ở chế độ toàn màn hình.</span>
<br>
<br>
<span><b>perspective</b>: Xác định chiều sâu.</span>
<br>
<br>
<span><b>perspective-origin</b>: Xác định vị trí dưới của phần tử 3D.</span>
<br>
<br>
<span><b>transform</b>: Áp dụng một chuyển đổi 2D hoặc 3D đến một phần tử.</span>
<br>
<br>
<span><b>transform-origin</b>: Cho phép bạn thay đổi vị trí trên phần tử transform.</span>
<br>
<br>
<span><b>transform-style</b>: Xác định các phần tử lồng nhau sẽ thế nào trong không gian 3D.</span>
<br>
<br>
</div>
<div class="title">
<marquee> Các thuộc tính Transitions</marquee>
</div>
<div class="description">
<span><b>transition</b>: Một thuộc tính viết tắt để thiết lập cho 4 thuộc tính chuyển đổi.</span>
<br>
<br>
<span><b>transition-property</b>: Xác định tên của thuộc tính CSS trong hiệu ứng của quá trình chuyển đổi(none, width, height, all).</span>
<br>
<br>
<span><b>transition-duration</b>: Xác định bao nhiêu giây hoặc mili giây một hiệu ứng chuyển đổi hoàn thành.</span>
<br>
<br>
<span><b>transition-timing-function</b>: Xác định đường cong tốc độ của hiệu ứng chuyển đổi.</span>
<br>
<br>
<span><b>transition-delay</b>: Xác định khi nào hiệu ứng chuyển đổi sẽ bắt đầu.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Basic User Interface</marquee>
</div>
<div class="description">
<span><b>box-sizing</b>: Báo cho trình duyệt các thuộc tính sizing (độ rộng và độ cao) nên có.</span>
<br>
<br>
<span><b>content</b>: Sử dụng với :before và :after pseudo-elements, để chèn nội dung được tạo ra.</span>
<br>
<br>
<span><b>cursor</b>: Xác định kiểu con trỏ chuột sẽ được hiển thị khi di chuyển vào phần tử nào đó.</span>
<br>
<br>
<span><b>ime-mode</b>: Điều khiển trạng thái của trình soạn thảo phương thức nhập cho trường văn bản.</span>
<br>
<br>
<span><b>nav-down</b>: Xác định nơi để di chuyển khi sử dụng phím mũi tên xuống.</span>
<br>
<br>
<span><b>nav-index</b>: Xác định thứ tự tab của phần tử.</span>
<br>
<br>
<span><b>nav-left</b>: Xác định nơi để di chuyển khi sử dụng phím mũi tên sang trái.</span>
<br>
<br>
<span><b>nav-right</b>: Xác định nơi để di chuyển khi sử dụng phím mũi tên sang phải.</span>
<br>
<br>
<span><b>nav-up</b>: Xác định nơi để di chuyển khi sử dụng phím mũi tên lên.</span>
<br>
<br>
<span><b>outline</b>: Thiết lập thuộc tính đường viền trong lời khai báo.</span>
<br>
<br>
<span><b>outline-color</b>: Đặt màu sắc của đường viền bao ngoài.</span>
<br>
<br>
<span><b>outline-offset</b>: Đệm đường viền bao ngoài, và rút nó ra bên ngoài cạnh đường viền (border).</span>
<br>
<br>
<span><b>outline-style</b>: Thiết lập kiểu của đường viền bao ngoài.</span>
<br>
<br>
<span><b>outline-width</b>: Thiết lập độ rộng của đường viền bao ngoài.</span>
<br>
<br>
<span><b>resize</b>: Xác định có hay không một phần tử là thay đổi kích thước bởi người dùng.</span>
<br>
<br>
<span><b>text-overflow</b>: Xác định các vấn đề khi văn bản tràn khỏi các phần tử container.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Multi-column Layout</marquee>
</div>
<div class="description">
<span><b>break-after</b>: Xác định cách xử lý ngắt trang, ngắt cột hoặc ngắt đoạn sau khi tạo hộp.</span>
<br>
<br>
<span><b>break-before</b>: Xác định cách xử lý ngắt trang, ngắt cột hoặc ngắt đoạn trước khi tạo hộp.</span>
<br>
<br>
<span><b>break-inside</b>: Xác định cách xử lý ngắt trang, ngắt cột hoặc ngắt đoạn bên trong hộp được tạo ra.</span>
<br>
<br>
<span><b>column-count</b>: Xác định số cột phần tử nên được chia thành.</span>
<br>
<br>
<span><b>column-fill</b>: Xác định như thế nào để điền vào cột.</span>
<br>
<br>
<span><b>column-gap</b>: Xác định khoảng cách giữa các cột.</span>
<br>
<br>
<span><b>column-rule</b>: Một thuộc tính viết tắt để thiết lập thuộc tính column-rule-* cho các đường kẻ giữa các cột.</span>
<br>
<br>
<span><b>column-rule-color</b>: Xác định màu sắc của các đường kẻ giữa các cột.</span>
<br>
<br>
<span><b>column-rule-style</b>: Xác định kiểu của các đường kẻ giữa các cột.</span>
<br>
<br>
<span><b>column-rule-width</b>: Xác định độ rộng của các đường kẻ giữa các cột.</span>
<br>
<br>
<span><b>column-span</b>: Xác định có bao nhiêu cột chứa phần tử được trải dài.</span>
<br>
<br>
<span><b>column-width</b>: Xác định độ rộng của cột.</span>
<br>
<br>
<span><b>columns</b>: Một thuộc tính viết tắt để thiết lập độ rộng cột (column-width) và số cột (column-count).</span>
<br>
<br>
<span><b>widows</b>: Xác định số dòng tối thiểu phải còn lại trên một trang khi ngắt trang xảy ra bên trong phần tử.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Paged Media</marquee>
</div>
<div class="description">
<span><b>orphans</b>: Thiết lập số dòng tối thiểu phải còn lại ở cuối của một trang khi ngắt ngang xảy ra bên trong phần tử.</span>
<br>
<br>
<span><b>page-break-after</b>: Thiết lập chế độ ngắt trang sau một phần tử.</span>
<br>
<br>
<span><b>page-break-before</b>: Thiết lập chế độ ngắt trang trước một phần tử.</span>
<br>
<br>
<span><b>page-break-inside</b>: Thiết lập chế độ ngắt trang bên trong một phần tử.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Generated Content cho trang đa phương tiện</marquee>
</div>
<div class="description">
<span><b>marks</b>: Thêm đoạn văn bản được đánh dấu và/hoặc sử dụng cho tài liệu.</span>
<br>
<br>
<span><b>quotes</b>: Thiết lập các loại dấu bao ngoài khi nhúng một trích dẫn.</span>
<br>
<br>
</div>
<div class="title">
<marquee>Các thuộc tính Speech</marquee>
</div>
<div class="description">
<span><b>mark</b>: Một thuộc tính viết tắt để thiết lập thuộc tính mark-before và mark-after.</span>
<br>
<br>
<span><b>mark-after</b>: Cho phép đánh dấu tên được gắn liền với những dòng âm thanh.</span>
<br>
<br>
<span><b>mark-before</b>: Cho phép đánh dấu tên được gắn liền với những dòng âm thanh.</span>
<br>
<br>
<span><b>phonemes</b>: xác định cách phát âm cho các văn bản chứa các phần tử tương ứng.</span>
<br>
<br>
<span><b>rest</b>: Một thuộc tính viết tắt để thiết lập thuộc tính the rest-before và rest-after.</span>
<br>
<br>
<span><b>rest-after</b>: Xác định phần còn lại hoặc ranh giới điệu tính được quan sát sau khi nói phần tử nội dung.</span>
<br>
<br>
<span><b>rest-before</b>: Xác định phần còn lại hoặc ranh giới điệu tính để quan sát trước khi nói phần tử nội dung.</span>
<br>
<br>
<span><b>voice-balance</b>: Xác định sự cân bằng giữa các kênh trái và phải.</span>
<br>
<br>
<span><b>voice-duration</b>: Xác định nó phải mất bao lâu để trả lại các lựa chọn phần tử nội dung.</span>
<br>
<br>
<span><b>voice-pitch</b>: Xác định mức độ trung bình (tần số) của giọng nói.</span>
<br>
<br>
<span><b>voice-pitch-range</b>: Xác định sự thay đổi của tần số.</span>
<br>
<br>
<span><b>voice-rate</b>: Điều khiển tốc độ nói.</span>
<br>
<br>
<span><b>voice-stress</b>: Chỉ ra cường độ của sự nhấn mạnh được áp dụng.</span>
<br>
<br>
<span><b>voice-volume</b>: Đề cập đến biên độ của dạng sóng đầu ra của các bài phát biểu.</span>
<br>
<br>
<a href="cacthetronghtml.html">Các thẻ trong HTML.</a>
<br>
<br>
<a href="thuoctinh.html">Các thuộc tính trong HTML</a>
<br>
<br>
</div>
</div>
<div class ="right">
<p>Support Tools and Compilation</p>
<a href="https://www.sublimetext.com/">
<img src="images/img1.png">
</a>
<a href="https://netbeans.apache.org/download/index.html"> <img src="images/img2.png">
</a>
<a href="https://code.visualstudio.com/insiders/">
<img src="images/img3.png">
</a>
</div>
</div>
</div>
</body>
</html>