Error message

  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Deprecated function: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in _filter_pubdlcnt() (line 50 of /home/mamast08nv/public_html/sites/all/modules/pubdlcnt/pubdlcnt.module).
  • Notice: Undefined offset: 1 in nice_menus_block_view() (line 306 of /home/mamast08nv/public_html/sites/all/modules/nice_menus/nice_menus.module).

Hướng dẫn học CSS3 cơ bản

   Bài hướng dẫn CSS3 và HTML5  dưới đây sẽ hướng dẫn một số thuộc tính mới: text-shadow, box-shadow, và border-radius.  Đây là các thuộc tính sẽ được sử dụng rất nhiều ở CSS3.

RGBA

3 giá trị đầu tiên xác định giá trị màu và giá trị cuối cùng là độ trong suốt

css3 RGBA

 RGBA có thể đưa vào bất kỳ thuộc tính nào như màu chữ, màu viền, màu nền, màu đổ bóng...

RGBA Background

RGBA Border

Text shadow

Text shadow - đổ bóng chữ - được xác định theo thứ tự: trục x, trục y, độ mờ và màu của bóng

 

css3 text shadow

Đặt các giá trị âm cho trục x để chuyển bóng về bên trái. Tương tự với giá trị âm cho trục y để chuyển bóng lên phía trên. Và tất nhiên, bạn có thể sử dụng RGBA cho màu sắc

 ví dụ css3 text shadow

Bạn cũng có thể đặt một danh sách đổ bóng chữ (cách nhau bởi dấu phẩy). Ví dụ dưới đây sử dụng hai lần đổ bóng để tạo hiệu ứng đẹp hơn (1px ở vị trí trên cùng màu đen và 1px ở dưới màu trắng)

1 text-shadow0 1px 0 #fff0 -1px 0 #000;

ví dụ css3 text shadow

 

Border Radius

Cách viết tắt cho bo viền border tương tự như padding và margin .Để bo viền ở các trình duyệt dùng webkit bạn thêm -webkit- vào trước, và với firefox (không dùng webkit) bạn thêm -moz- vào trước

 css3 border radius

Bạn có thể đặt các giá trị khác nhau cho các góc khác nhau. Tất nhiên là nên nhớ vụ -webkit và -moz.

 css3 border radius corner

Box shadow

Cấu trúc đổ bóng tương tự với text-shadow: trục x, trục y, độ mờ và màu

 css3 box shadow

Tất nhiên là bạn cũng có thể áp dụng nhiều box-shadow vào một box. Ví dụ:

   
   
1 -moz-box-shadow:
2 -2px -2px 0 #fff,
3 2px 2px 0 #bb9595,
4 2px 4px 15px rgba(000, .3);

css3 box shadow

                                                                                                                                                  

Tin tức khác:

 + Học thiết kế web

 + Đào tạo wordpress

 + Đào tạo quản trị web tại Hà Nội

 + Khóa học đồ họa in ấn