Học web chuẩn hocwebchuan.com

  • Trang chủ
  • Hướng dẫn học

    • Hướng dẫn học XHTML & HTML5
    • Hướng dẫn học CSS
    • Hướng dẫn học CSS3
    • Hướng dẫn học Responsive
    • Hướng dẫn học ES6
    • Hướng dẫn học React.js
    • Hướng dẫn học jQuery
    • Hướng dẫn học PHP
    • Hướng dẫn học Laravel
    • Hướng dẫn học Webpack
    • Hướng dẫn học SCSS
    • Hướng dẫn học htaccess
  • Bài tập

    • Bài tập XHTML & HTML5 cơ bản
    • Bài tập XHTML & HTML5 nâng cao
    • Bài tập CSS & CSS3 cơ bản
    • Bài tập CSS & CSS3 nâng cao
    • Bài tập jQuery
  • Tham khảo

    • Tham khảo HTML4/XHTML
    • Tham khảo HTML5
    • Tham khảo CSS
    • Tham khảo CSS3
    • Tham khảo jQuery
  • Chuyên đề

    • Chuyên đề HTML/CSS
      • Block list
      • List
      • Navigation
      • Pagenation
      • Paragraph
      • Table
      • Tiêu đề
    • Chuyên đề HTML5/CSS3
      • Border radius
      • Box hover
      • Box shadow
      • Loading
    • Chuyên đề jQuery/JS
      • Form
      • Layout
    • jQuery/JS plugin
      • BiggerLink
      • Fixheight
      • Pie
      • Pop up
      • Tab
      • Tooltips
  • Công cụ hỗ trợ

    • CSS3 Generator
      • Background-gradient
      • Background transparence
      • Boder-radius
      • Box-shadow
      • Flex box
      • Transform
      • Transform 3D
      • Mutiple column
      • Text-shadow
      • Text editor
    • Generator Tools
      • Block float generator
      • Block float percent generator
      • Text dummy paragraph (Lorem Ipsum)
      • Text dummy list (Lorem Ipsum)
      • Image dummy generator
      • QR Code generator
    • Web Tools
      • Đếm ký tự (count characters)
      • Đếm từ (count words)
      • Chuyển đổi ký tự đặc biệt
      • Có dấu thành không dấu
      • Loại bỏ code html
      • Công cụ tính toán (Caculator tools)
      • Chuyển đổi image thành WebP
    • Random Tools
      • Random word
      • Random number
      • Random list
      • Random group
      • Random password
    • Công cụ test responsive
    • Chia sẻ web & tools hay

Search Submit

Chuyên đề

  • Trang chủ
  • Chuyên đề

HỌC WEB CHUẨN

HƯỚNG DẪN HỌC

  • Hướng dẫn học
  • Hướng dẫn học XHTML & HTML5
  • Hướng dẫn học CSS
  • Hướng dẫn học CSS3
  • Hướng dẫn học Responsive
  • Hướng dẫn học ES6
  • Hướng dẫn học React.js
  • Hướng dẫn học jQuery
  • Hướng dẫn học PHP
  • Hướng dẫn học Laravel
  • Hướng dẫn học Wordpress
  • Hướng dẫn học Webpack
  • Hướng dẫn học SCSS

THAM KHẢO

  • Tham khảo
  • Tham khảo HTML4/XHTML
  • Tham khảo HTML5
  • Tham khảo CSS
  • Tham khảo CSS3
  • Tham khảo jQuery

CHUYÊN ĐỀ

Chuyên đề

  • Chuyên đề HTML/CSS (43)
    • Block list (6)
    • List (5)
    • Navigation (5)
    • Pagenation (6)
    • Paragraph (8)
    • Table (7)
    • Tiêu đề (6)
  • Chuyên đề HTML5/CSS3 (20)
    • Border radius (7)
    • Box hover (5)
    • Box shadow (4)
    • Loading (4)
  • Chuyên đề jQuery / JS (15)
    • Form (6)
    • Layout (9)
  • jQuery/JS plugin (16)
    • BiggerLink (3)
    • Fixheight (2)
    • Pie (4)
    • Pop up (3)
    • Tab (2)
    • Tooltips (2)

Nội dung mới nhất

  • Áp dụng thực tế hiệu ứng loading
  • Box hover 2 image
  • Box hover fade
  • box hover slide element
  • Box hover chuyển động thành phần
  • Box hover scale image
  • Loading syle css3 – circle 02
  • Loading syle css3 – circle
  • Loading style css3 – square
  • Box-shadow sử dụng khi hover

Liên kết nhanh

add align biggerlink Block list Border radius box-shadow box hover css3 fixheight form jQuery layout list loading Navigation pa Pagenation paragraph Pie popup tab Table tiêu đề tooltips

GÓP Ý - LIÊN HỆ

  • CÔNG CỤ TẠO CSS3
    CSS3 GENERATOR
  • BỘ CÔNG CỤ
    GENERATOR TOOLS
  • CÔNG CỤ HỖ TRỢ
    WEB TOOLS
  • CÔNG CỤ TẠO RANDOM
    RANDOM GENERATOR
  • CÔNG CỤ KIỂM TRA RESPONSIVE TEST
  • CHIA SẺ HAY
    WEB & TOOLS
  • Follow us on hocwebchuan.com
  • Short URL
  • Rabbie theme

Tag: layout

Canh giữa thành phần con

Canh giữa thành phần con

Chuyên đề jQuery / JS, LayoutTags align, layout | Gửi bình luận

Việc canh giữa thành phần con theo chiều dọc và cả theo chiều ngang bằng CSS trở nên phức tạp, với jQuery bạn có thể thực hiện dễ dàng hơn với cách dùng đơn giản hơn.

Chi tiết

Thêm thành phần với .before()

Thêm thành phần với .before()

LayoutTags add, layout | Gửi bình luận

Đôi khi muốn thêm một thành phần vào trước thành phần đã có, có khi cần nhiều cách xử lý chuỗi, hay kết hợp nhều thành phần khác nhau, ở jQuery có cung cấp cho chúng ta cách tiếp cần dễ hơn với .before().

Chi tiết

Thêm thành phần với .after()

Thêm thành phần với .after()

LayoutTags add, layout | Gửi bình luận

Thêm mới một thành phần ngay sau thành phần đã tồn tại, không gì hay bằng .after().

Chi tiết

Thêm thành phần với .append()

Thêm thành phần với .append()

LayoutTags add, layout | Gửi bình luận

Nếu việc thêm một thành phần gây mất thời gian cho bạn khi phải lấy giá trị và cộng chuỗi, thì jQuery cung cấp một function đơn giản hơn .append().

Chi tiết

Thêm thành phần với .appendTo()

Thêm thành phần với .appendTo()

LayoutTags add, layout | Gửi bình luận

Để thêm hoặc di chuyển một thành phần mới tới thành phần đã tồn tại, chúng ta có thể làm nhiều cách khác nhau, một trong cách hữu dụng mà đơn giản là dùng .appendTo().

Chi tiết

Tiêu đề với background bo góc tròn

Tiêu đề với background bo góc tròn

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Trong một số design có sử dụng image có góc tròn, hay có độ lặp lại, nếu dùng được border-radius thì tốt, nhưng nếu là design đặc biệt thì việc dùng background image cũng hết sức cần thiết.

Chi tiết

Tiêu đề với background icon nằm bên phải

Tiêu đề với background icon nằm bên phải

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Việc xử lý background icon như thế nào sẽ tác động đến bộ mặt của trang web, vì tiêu đề thường đưa thông tin quan trọng, và có nhiều dạng như nhau trong cùng một trang. Icon nằm bên phải cũng là một dạng thường dùng.

Chi tiết

Tiêu đề với dòng text giải thích

Tiêu đề với dòng text giải thích

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Đôi lúc việc giải nghĩa thêm cho một tiêu đề là cần thiết, giúp cho user hiểu rõ nghĩa hơn nội dung cần nói về cái gì.

Chi tiết

Tiêu đề với background là một icon

Tiêu đề với background là một icon

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Cách thực hiện tiêu đề có icon, sử dụng image cũng tốt, tuy nhiên dùng background sẽ làm tối giản souce code html, giúp ích cho SEO.

Chi tiết

Tiêu đề với background-image

Tiêu đề với background-image

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Sử dụng background-image cho tiêu đề, là một kỹ thuật đơn giản nhưng sẽ giúp nhiều trong việc làm hấp dẫn hơn cho một tiêu đề.

Chi tiết

Lấy nội dung bằng .html()

Lấy nội dung bằng .html()

LayoutTags layout, tiêu đề | Gửi bình luận

Trong jQuery có một hàm rất hữu dụng trong việc lấy nội dung của các thành phần html, đó chính là .html() – đơn gian, dễ sử dụng.

Chi tiết

Tiêu đề cơ bản

Tiêu đề cơ bản

Tiêu đềTags layout, tiêu đề | Gửi bình luận

Một số dạng tiêu đề cơ bản, thường dùng, chỉ vài dòng code HTML/CSS nhưng mang lại hiệu quả tốt.

Chi tiết

  • Hướng dẫn học

    • Hướng dẫn học
    • Hướng dẫn HTML/XHTML
    • Hướng dẫn CSS
    • Hướng dẫn CSS3
    • Hướng dẫn học Responsive
    • Hướng dẫn PHP
    • Hướng dẫn Laravel
  • Tham khảo

    • Tham khảo HTML/XHTML
    • Tham khảo HTML5
    • Tham khảo CSS
    • Tham khảo CSS3
    • Tham khảo jQuery
  • Tham khảo Thêm

    • Lang codes
    • Font family
    • Mã ký tự
    • MIME
    • Thuộc tính tổng quát
  • Chuyên đề

    • Chuyên đề
    • Chuyên đề HTML/CSS
    • Chuyên đề HTML5/CSS3
    • Chuyên đề jQuery/JS
    • jQuery/JS plugin
  • Góp ý - Liên hệ

    Bản quyền - copyright

    Sitemap

  • W3C XHTML1.0
  • W3C CSS

©2012 Học Web Chuẩn All Rights Reserved.

  • Trang chủ
  • Giới thiệu
  • Góp ý - Liên hệ
  • Site map