Tạo Layout Đơn Giản Bằng Css & Div

--- Bài mới hơn ---

  • Cách Kiểm Tra Nền Tảng Xây Dựng Website Nhanh Nhất
  • 2 Cách Tạo Sitemap Cho Website Nhanh Dễ Dàng Nhất Hiện Nay
  • Hướng Dẫn Chi Tiết Cách Tạo Menu Trong WordPress
  • Hướng Dẫn Cách Tạo Menu Trong Website WordPress
  • Hướng Dẫn Tạo Menu Trên Website WordPress
  • Để tăng sự mềm dẻo cho trang web, hiện nay người ta đang cố gắng loại bỏ các table khi thiết kế layout, thay vào đó là sử dụng thẻ DIV và kết hợp với CSS. Bài viết này cung cấp một ví dụ đơn giản giúp chúng ta có thể nhanh chóng dựng một layout mà không tốn quá nhiều thời gian cho việc design.

    Ví dụ này trình bày cách thiết kế 1 layout gồm 3 phần: header, body, footer. Trong đó phần body gồm left_bodymain_body.

    example.html

    example.css

    1. * {
    2. margin:0;
    3. }
    4. body {
    5. text-align:center;
    6. }
    7. margin:auto;
    8. width:800px;
    9. }
    10. height:100px;
    11. background:#99CC66;
    12. }
    13. height:100px;
    14. background:#339933;
    15. }
    16. width:100px;
    17. height:600px;
    18. background:#FF9900;
    19. }
    20. width:700px;
    21. height:600px;
    22. background:#99CCFF;
    23. }
    24. .vide {
    25. clear:both;
    26. }

    Như ta thấy ở trên, file html không có gì đặc biệt, nó chỉ bao gồm cấu trúc các thành phần mà ta cần bố trí, còn bố trí như thế nào thì phụ thuộc hoàn toàn vào file CSS.

    Bây giờ, ta sẽ tìm hiểu từng bước cách tạo layout trên:

    – Tạo p #wrapper dùng để bao hàm toàn bộ trang web. Ta cần căn giữa p này trong cửa sổ để giúp trang web của chúng ta thích ứng với nhiều loại màn hình và độ phân giải khác nhau. Để làm được điều này, ta dùng margin:auto cho Firefox (vô dụng với IE ) và text-align:center trong body cho IE (vô dụng vơi FF ). Cuối cùng, thuộc tính width quyết định độ rộng trang web.

    – Tạo các p: #header, #footer, #body. Không có gì đặc biệt, chúng sẽ lấy hết độ rộng của #wrapper và bố trí liên tiếp nhau từ trên xuống dưới:

    – Bây giờ trong p #body, ta sẽ chia làm 2 cột bằng cách tạo 2 p #body_left#body_main với 2 thuộc tính float (trôi nổi) và width. 2 p này sẽ bố trí liên tiếp nhau từ trái sang phải, nếu #body có đủ độ rộng:

    – Vấn đề bắt đầu nảy sinh: #footer biến mất 1 cách đầy bí ẩn . Thực ra nó ko biến đi đâu cả, có điều ta ko nhìn thấy được vì nó đã bị #body_left#body_main che mất. Lý do: #body tuy bao hàm #body_left#body_main, nhưng chiều cao của nó lại không phụ thuộc vào chiều cao của #body_left hay #body_main (do thuộc tính “trôi nổi” của chúng). #footer nằm sát dưới #body, mà #bodyheight 0, cho nên #footer sẽ nằm sát dưới #header, và bị #body_left#body_main che khuất.

    Dĩ nhiên ta có thể đặt height cho #body bằng với height của #body_left và #body_main để đẩy #footer xuống đúng chỗ. Tuy nhiên #body_left#body_main thường có height thay đổi (phụ thuộc vào nội dung của chúng), và height của chúng thường cũng không bằng nhau. Cho nên ta chọn giải pháp là đặt thêm 1 p đặc biệt với thuộc tính clear:both bên dưới. Với thuộc tính clear:both, p đặc biệt này sẽ luôn nằm sát dưới 2 p “trôi nổi” kia. #body lại luôn phải bao hàm p đặc biệt này, do đó, nó sẽ luôn có height bằng với height lớn nhất của #body_left #body_main. Nhờ vậy, #footer luôn được định vị đúng chỗ:

    OK! Vậy là ta đã dựng xong một layout mềm dẻo, với code html hết sức gọn gàng sáng sủa. Một điều cần lưu ý là khi bố trí các p tạo cột, cần tính với độ rộng bao ngoài của p đó (margin+border+padding+width). Ở ví dụ này, nếu #body_mainpadding:5px thì #wrapper phải rộng ra thêm 10px nữa mới đủ chỗ, nếu không nó sẽ nhảy xuống dưới .

    [Nghean-Aptech st]

    --- Bài cũ hơn ---

  • Các Kỹ Thuật Cần Biết Để Xây Dựng Layout Cho Một Website
  • Hướng Dẫn Cách Tạo Khung Nhìn Trong Layout 2022
  • Bắt Đầu Với Phát Triển Plugin Joomla
  • Hướng Dẫn Quản Trị Website Với Joomla Từ A Đến Z
  • Hướng Dẫn Toàn Tập Thiết Kế Website Bằng Joomla Cho Người Mới Bắt Đầu
  • Tạo Album Hình Ảnh Đơn Giản Bằng Css

    --- Bài mới hơn ---

  • Album Ảnh Gia Đình Với Những Ý Tưởng Chụp Hình Độc Đáo
  • Hướng Dẫn Cách Tạo Album Ảnh Bằng Powerpoint 2022, 2013, 2010
  • Hướng Dẫn Cách Tạo Video Ảnh Và Nhạc Trên Youtube 2022
  • Hướng Dẫn Cài Avatar Video Facebook Trên Điện Thoại
  • Cách Tạo Hình Đại Diện Của Riêng Bạn ▷ ➡️ Ngừng Sáng Tạo ▷ ➡️
  • Tạo bộ sưu tập ảnh đơn giản

    chúng tôi {

    margin: 5px;

    border: 1px solid #ccc;

    float: left;

    width: 200px;

    }

    p.img:hover {

    border: 1px solid #777;

    }

    chúng tôi img {

    width:100%;

    height: auto;

    }

    chúng tôi {

    padding: 10px;

    text-align: center;

    }

    Xem ví dụ

    Tạo bộ sưu tập ảnh nâng cao

    Đồng ruộng

    Thích

    Đôi bạn vẹt

    Thích

    Vườn hóa phong lan

    Thích

    Rừng thông

    Thích

    .box{

    float: left;

    position: relative;

    margin:0px 10px 10px 0px;

    }

    img{

    width:200px;

    height:200px;

    margin:0px;

    padding: 0px;

    border:1px solid black;

    }

    .title{

    position: absolute;

    width: 100%;

    bottom:0px;

    display: none;

    }

    .title h3{

    margin:0px 0px 0px 8px;

    color: white;

    }

    .title hr{

    border:0px;

    border-bottom:1px solid #ddd;

    }

    .title p{

    margin: 0px 0px 13px 8px;

    color:#ddd;

    }

    .box:hover img{

    opacity: 0.9;

    }

    .box:hover .title{

    display: inherit;

    }

    Xem ví dụ

    --- Bài cũ hơn ---

  • Cách Tạo Bộ Sưu Tập Ảnh Cho Bài Viết Trong WordPress Không Dùng Plugin – Fitwp
  • Chỉnh Sửa Ảnh Cưới Chuyên Nghiệp Và Các Bí Kíp Không Thể Bỏ Qua
  • 6 Mẫu Album Ảnh Cưới Đẹp Nhất Hiện Nay Dành Cho Các Cặp Đôi
  • Tham Khảo Những Mẫu Album Ảnh Cưới Đẹp Nhất Hiện Nay
  • Phần Mềm Làm Album Ảnh Cưới 3D Chuyên Nghiệp Nhất Hiện Nay, Hướng Dẫn Làm Album Ảnh Bằng Phần Mềm 3D Album
  • Tạo Layout Đơn Giản Với Div Và Css

    --- Bài mới hơn ---

  • Css Là Gì Cách Nhúng Mã Css Vào Html
  • Phần Mềm Việt Hỗ Trợ Tạo Tài Liệ Định Dạng Chm
  • Các Câu Lệnh Thường Dùng Trên Cmd
  • Cách Tự Tạo File Cài Đặt Microsoft Office 365, 2022, 2022, 2013
  • Csgo: Hướng Dẫn Tạo Config Để Tập Luyện Trong Game
  • Việc sử dụng DIV kết hợp với CSS để làm layout (bố cục) cho một trang web đã trở lên phổ biến và đạt hiệu quả cao. Chẳng hạn bạn cần thiết kế một trang có giao diện được thiết kế với layout như sau:

    1. main: Phân vùng chứa toàn bộ nội dung của trang.
    2. head: Phân vùng chứa nội dung đầu tiên của trang (theo VD trên đó là phần logo + banner)
    3. head-link: Phân vùng chứa các liên kết đầu trang (ở VD trên: Home, Students, Course, v.v.)
    4. left: Phân vùng chứa các nội dung bên trái (ở VD trên là các liên kết trái)
    5. content: Phân vùng chứa các nội dung chính của trang (ở VD trên là các phân vùng thông tin như: Hot news, Photo Slide, News 1, v.v.)
    6. right: Phân vùng chứa các thông tin bên phải trang (ở VD trên là lịch, biểu đồ, bản đồ)
    7. footer: Phân vùng chứa các thông tin cuối trang (ở VD trên là thông tin về chủ sở hữu và các liên kết)

    Chạy thử trang trên trình duyệt kết quả sẽ như sau:

    1. Tạo bộ chọn body để cố định phông chữ cho cả trang và bộ chọn #main để cố định độ rộng vùng thông tin và trang sẽ chiếm và căn chỉnh vùng này nằm giữa màn hình.

    2. Tạo bộ chọn #head xác định chiều cao, màu nền, đường viền và khoảng cách so với các vùng khác (khoảng cách so với vùng bên dưới – margin-bottom).

    3. Kiểm tra lại trang trên trình duyệt bạn sẽ có kết quả sau (phần p với id là head đã được xác định):

    height: 30px;

    line-height: 30px;

    padding-left: 10px;

    padding-right: 10px;

    border: 1px solid #CDCDCD;

    background-color: #F5F5F5;

    margin-bottom:5px;

    clear: both;

    }

    #left{

    width: 150px;

    min-height: 400px;

    border: 1px solid #CDCDCD;

    float:left;

    background-color: #004C00;

    margin-bottom: 5px;

    }

    9. Quan sát lại trang

    height: 50px;

    clear: both;

    border: 1px solid #CDCDCD;

    background-color: #F8F8FF;

    }

    [/sourcecode]

    11. Quan sát lại trang trên trình duyệt bạn sẽ thấy các phân vùng cần thiết đã vào đúng vị trí cần đặt:

    --- Bài cũ hơn ---

  • Cách Chuyển Đổi Bmp Sang Pdf Bằng Máy In Pdf
  • Cách Tạo Rest Api Với Json Server
  • Cách “tạo Dáng Với Áo Dài Nam ” Cá Tính
  • Mách Bạn 8 Bí Quyết “cách Tạo Dáng Selfie Nam” Cực Ngầu Đầy Cuốn Hút
  • 20 Cách Tạo Dáng Chụp Ảnh Nam Đẹp Và Ngầu
  • Css Là Gì Cách Nhúng Mã Css Vào Html

    --- Bài mới hơn ---

  • Phần Mềm Việt Hỗ Trợ Tạo Tài Liệ Định Dạng Chm
  • Các Câu Lệnh Thường Dùng Trên Cmd
  • Cách Tự Tạo File Cài Đặt Microsoft Office 365, 2022, 2022, 2013
  • Csgo: Hướng Dẫn Tạo Config Để Tập Luyện Trong Game
  • Tìm Hiểu Về Filevàtrong Sources Iso
  • CSS là gì?

    CSS viết tắt của cụm từ Cascading Style Sheets, về ngữ nghĩa thì có thể hiểu: Cascading là cách làm việc của CSS, các CSS tác dụng vào phần tử HTML có thể bị đè (định nghĩa lại) bởi CSS khác hoặc kết hợp cùng với CSS khác. Còn Style Sheets điều khiển cách hiện thị nội dung trang web.

    CSS và HTML luôn đi cùng nhau: HTML tạo ra cấu trúc, nội dung các phần tử trong trang, CSS quy định cách hiện thị phần tử trên trang.

    Để học về CSS trước tiên phải hiểu cơ bản về HTML.

    Tại sao cần dùng CSS?

    CSS cho phép bạn định nghĩa kiểu, cách hiện thị cho các phần tử HTML. Giúp bạn phân tách giữa nội dung trang và cách trình bày trang. Nếu chỉ sử dụng HTML thì định dạng phần tử, kiểu phần tử phải ở cùng một vị trí với phần tử trong văn bản, điều này rất khó để bảo trì khi trang web phức tạp nên. Khi sử dụng CSS thì các định đạng được loại bỏ khỏi văn bản HTML, định dạng được lưu vào một file CSS.

    Nhúng CSS vào HTML

    Để áp dụng CSS tác dụng vào các phần HTML có ba cách nhúng CSS: , InternalExternal

    • Inline: mã CSS viết tại thuộc tính style của phần tử HTML

    Nhúng CSS dạng inline – thuộc tính style

    Cách này là đặt mã CSS vào thẳng thuộc tính style của phần tử. Mã CSS chỉ tác động nên chính phần tử đó.

    Ví dụ đoạn mã CSS sau đặt màu chữ phần tử là trắng, màu nền phần tử là đỏ

    color:white; background-color:red;

    Giờ gán CSS đó cho một phần tử (ví dụ p) trong HTML, ở dạng inline thì thực hiện như sau:

    Bạn có thể thử thay các màu khác để kiểm tra như: blue, green, navy, orange …

    Nhúng CSS dạng Internal – thẻ style

    Nhúng CSS dạng External – thẻ link tải file CSS

    Cách này các mã CSS bạn viết tập trung vào một file độc lập với file HTML (thường đặt phần mở rộng là css) sau đó dùng thẻ link đặt ở phần head để nạp vào theo cú pháp, ví dụ file ngoài là demo.css

    Trong file demo.css bạn viết nội dung CSS (không có thẻ style), ví dụ:

    p { color:white; background-color:red; }

    Kết quả sẽ tương tự như ví dụ trên, chỉ có điều mã CSS đã đặt ra một file độc lập. Thuộc tính href trỏ đến địa chỉ URL của file CSS, ở ví dụ trên là địa chỉ dạng tương đối vì file CSS và HTML cùng thư mục.

    Ví dụ nữa, thử tích hợp các CSS định nghĩa bởi Framework Bootstrap, ở đường dẫn: https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css

    Sau khi tích hợp thì sẽ có các lớp CSS sử dụng ngay như display-1, text-success ...

    --- Bài cũ hơn ---

  • Tạo Layout Đơn Giản Với Div Và Css
  • Cách Chuyển Đổi Bmp Sang Pdf Bằng Máy In Pdf
  • Cách Tạo Rest Api Với Json Server
  • Cách “tạo Dáng Với Áo Dài Nam ” Cá Tính
  • Mách Bạn 8 Bí Quyết “cách Tạo Dáng Selfie Nam” Cực Ngầu Đầy Cuốn Hút
  • Hướng Dẫn Tạo Menu Icon Cho Website Với Html & Css

    --- Bài mới hơn ---

  • Cách Tạo Liên Kết Nofollow Trong Website: 2 Phương Pháp Dễ Dàng
  • Tạo Website Cá Nhân Miễn Phí Dễ Dàng
  • Bộ Sưu Tập Trang Web Cá Nhân Tốt Nhất (2021)
  • Thiết Kế Trang Web Tổng Hợp Phim Online Chuyên Nghiệp Không Giật
  • Hướng Dẫn Tạo Template Trong Genesis
  • Chào bạn, Menu Icon thường được dùng nhiều trong thiết kế menu cho website. trong bài viết hôm nay, Học lập trình Asia xin được hướng dẫn tạo Menu Icon cho website với HTML & CSS. Mời bạn cùng theo dõi.

    1. Menu Icon là gì?

    Menu Icon là một biểu tượng nhỏ, thường được sử dụng trong thiết kế giao diện di động cho website. Khi người dùng nhấp vào menu icon thì một danh sách các đề mục sẽ được hiển thị ra. Mục đích của việc sử dụng menu icon để tối giản diện tích trên màn hình điện thoại.

    Bước 1: Thêm HTML

    Bước 2: Thêm CSS

    p { width: 35px; height: 5px; background-color: black; margin: 6px 0; }

    Code HTML đầy đủ

    p {

    width: 35px;

    height: 5px;

    background-color: black;

    margin: 6px 0;

    }

    Thuộc tính widthheight chỉ định chiều rộng và chiều cao của mỗi thanh.

    Mình sử dụng background-colorđể thêm một màu nền đen và margin sử dụng để tạo khoảng cách giữa mỗi thanh lề trên và lề dưới.

    3. Cách để tạo Menu Icon động

    Sử dụng CSS và JavaScript để thay đổi biểu tượng menu thành biểu tượng “hủy / xóa” khi nhấp vào:

    Bước 1: Thêm HTML

    Bước 2: Thêm CSS

    .container { display: inline-block; cursor: pointer; } .bar1, .bar2, .bar3 { width: 35px; height: 5px; background-color: #333; margin: 6px 0; transition: 0.4s; } /* Rotate first bar */ .change .bar1 { -webkit-transform: rotate(-45deg) translate(-9px, 6px) ; transform: rotate(-45deg) translate(-9px, 6px) ; } /* Fade out the second bar */ .change .bar2 { opacity: 0; } /* Rotate last bar */ .change .bar3 { -webkit-transform: rotate(45deg) translate(-8px, -8px) ; transform: rotate(45deg) translate(-8px, -8px) ; }

    Bước 3: Thêm JavaScript

    function myFunction(x) { x.classList.toggle("change"); }

    Code HTML đầy đủ

    .container {

    display: inline-block;

    cursor: pointer;

    }

    .bar1, .bar2, .bar3 {

    width: 35px;

    height: 5px;

    background-color: #333;

    margin: 6px 0;

    transition: 0.4s;

    }

    .change .bar1 {

    -webkit-transform: rotate(-45deg) translate(-9px, 6px);

    transform: rotate(-45deg) translate(-9px, 6px);

    }

    .change .bar2 {opacity: 0;}

    .change .bar3 {

    -webkit-transform: rotate(45deg) translate(-8px, -8px);

    transform: rotate(45deg) translate(-8px, -8px);

    }

    function myFunction(x) {

    x.classList.toggle(“change”);

    }

    Phần tử container được sử dụng để hiển thị biểu tượng con trỏ khi người dùng di chuyển chuột qua thanh . Khi được nhấp vào, nó sẽ thực thi một hàm JavaScript thêm tên lớp mới vào nó, nó sẽ thay đổi kiểu của từng thanh ngang: thanh đầu tiên và thanh cuối cùng được chuyển đổi và xoay thành chữ “X”. Thanh ở giữa mờ dần và rồi biến mất.

    4. Lời kết

    Chúng ta đã tìm hiểu xong cách tạo Menu Icon cho website rồi. Menu Icon tuy nhỏ nhưng sẽ giúp cho website của chúng ta đẹp hơn, sinh động hơn, từ đó người xem có cái nhìn ấn tượng hơn đối với website của chúng ta. Cảm ơn các bạn đã quan tâm bài viết!

    --- Bài cũ hơn ---

  • Hướng Dẫn Tạo Trang Web Đơn Giản Cho Người Mới Bắt Đầu
  • Cách Bắt Đầu Và Chạy Một Trang Web Diễn Đàn
  • Cách Tạo Site Link Sitelink Là Gì? Sitelink 2022
  • Cách Tổ Chức Chiến Dịch Xây Dựng Liên Kết Lý Tưởng Cho Website
  • Tạo Tài Khoản Google Drive Unlimited Miễn Phí Tại Adc Việt Nam
  • Thực Hành Tạo Form Đăng Ký Đẹp Bằng Html Và Css

    --- Bài mới hơn ---

  • Hỗ Trợ : Cách Tạo Thư Mục Trong Word Như Thế Nào?
  • Cách Tổ Chức Bộ Sưu Tập Ebook Của Bạn Với Calibre / Làm Thế Nào Để
  • Cách Tạo Mật Khẩu Bảo Vệ Thư Mục Cực Đơn Giản, Không Cần Bất Cứ Phần Mềm Nào
  • Cách Tạo Và Chạy Script Shell Trong Ubuntu 20.04 Lts
  • Cách Tạo Thư Mục Trong Java (How To Create Directory In Java)
  • Ngay sau đây, chúng ta sẽ đi vào chi tiết bài thực hành hôm nay. Mình xin phân tích về các thành phần cơ bản của form đăng ký mà chúng ta sẽ làm gồm:

    • Tiêu đề form đăng ký
    • Ô nhập dữ liệu cho tài khoản đăng nhập, mật khẩu, giới tính, ngày sinh, sở thích, giới thiệu bản thân
    • Nút nhấn gửi dữ liệu, nút nhấn reset form.

    Kết quả và yêu cầu cho form đăng ký bằng html và css

    (Ảnh chụp màn hình sau khi form đăng ký hoàn thiện.)

    Yêu cầu: form đăng ký có khả năng cho phép người dùng nhập dữ liệu, có thể hiển thị tốt trên nhiều thiết bị, bao gồm điện thoại di động, laptop, máy tính bảng.

    Cấu trúc file và thư mục

    Bắt đầu viết mã html cho form đăng ký

    Các bạn mở file chúng tôi bằng phần mềm soạn thảo mã nguồn bất kỳ, và dán nội dung như sau, sau đó các bạn lưu file.

    Định dạng form đăng ký bằng css

    Các bạn mở file chúng tôi bằng phần mềm soạn thảo mã nguồn bất kỳ, và dán nội dung như sau, sau đó các bạn lưu file.

    *{ padding: 0px; margin: 0px; font-family: sans-serif; box-sizing: border-box; } .container{ width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; } .col-6{ float: left; width: 50%; } .margin_b{ margin-bottom: 7.5px; } .clear{ clear: both; } header{ background-color: #cccccc; min-height: 70px; padding: 15px; } main{ background-color: #dddddd; min-height: 300px; padding: 7.5px 15px; } footer{ background-color: #cccccc; min-height: 70px; padding: 15px; } h1{ color: #009999; font-size: 20px; margin-bottom: 30px; } .register-form{ width: 100%; max-width: 400px; margin: 20px auto; background-color: #ffffff; padding: 15px; border: 2px dotted #cccccc; border-radius: 10px; } .input-box{ margin-bottom: 10px; } .input-box input, .input-box input{ height: 1.5em; width: 1.5em; vertical-align: middle; line-height: 2em; } .input-box textarea{ padding: 7.5px 15px; width: 100%; border: 1px solid #cccccc; outline: none; font-size: 16px; min-height: 120px; color: #666666; } .btn-box{ text-align: right; margin-top: 30px; } .btn-box button{ padding: 7.5px 15px; border-radius: 2px; background-color: #009999; color: #ffffff; border: none; outline: none; }

    Xem kết quả form đăng ký trên trình duyệt

    Như vậy là đã hoàn tất, các bạn có thể xem trực tiếp kết quả trên trình duyệt bằng cách nhấn chuột phải vào file chúng tôi và chọn “open with”, tiếp đến chọn trình duyệt mà bạn muốn xem kết quả.

    Lưu ý khi thực hành viết html và css

    Trước tiên, chúng ta sẽ tiến hành viết html đơn giản, sau đó tiến hành thêm các thuộc tính nhận dạng cho các thẻ html. Tiếp đến, tạo và liên kết file css. Viết mã nguồn css theo nguyên tắc định dạng cho cái tổng quát trước, cái chi tiết sau.

    Tải code tạo form đăng ký bằng html và css

    --- Bài cũ hơn ---

  • Cách Dễ Dàng Tạo Biểu Mẫu Pdf Có Thể Điền Trên Máy Mac Của Bạn Bằng Pdfelement 6
  • Cách Tạo Pdf Có Thể Điền Miễn Phí
  • Làm Thế Nào Để Tạo Và Lưu Một Tài Liệu Word Trong Microsoft Office Cho Android
  • Hướng Dẫn Tạo Mật Khẩu Bảo Vệ File Excel
  • Cách Tạo Bảng Trong Excel
  • Tạo Video Background Bằng Css Và Javascript Cho Trang Web Năm 2022

    --- Bài mới hơn ---

  • Cách Tạo Background Slideshow Cho Website Bằng Bootstrap
  • Cách Tạo Video Background Cho Website Vô Cùng Đơn Giản
  • Gợi Ý Các Lựa Chọn Làm Background Khi Thiết Kế Website
  • Tạo Một Trang Web Bằng Google Site Miễn Phí Trong Vài Phút
  • Cách Tạo Web Miễn Phí Miễn Phí Từ Google Sites Phần 1
    • source: là nơi bạn xác định video được lưu trữ và khai báo loại định dạng cho video.
    • muted: là thuộc tính dùng để xác định video không phát âm thanh trong trang web.
    • playsinline: là thuộc tính để bạn có thể phát toàn màn hình video trên IOS.
    • autoplay: tự động phát video khi trang được tải.
    • loop: sẽ tự động phát lại khi video kết thúc.

    Tiếp theo chúng ta sẽ thiết lập các thuộc tính CSS để tạo video background cho trang web:

    See the Pen Cách tạo video background bằng HTML và CSS by haycuoilennao19 (@haycuoilennao19) on CodePen.

    Nguồn Cách tạo video background bằng HTML và CSS

    Thông thường chúng ta sẽ cần video background để có thể làm nổi bật nội dung nào đó để thu hút sự chú ý của người dùng tới thông điệp mà ta muốn nhấn mạnh.

    video {

    width: 100vw;

    height: 100vh;

    position: fixed;

    top: 0;

    left: 0;

    object-fit: cover;

    }

    .noi_dung {

    position: relative;

    height: 100vh;

    text-align: center;

    display: flex;

    align-items: center;

    justify-content: center;

    }

    h1 {

    color: CornflowerBlue;

    text-transform: uppercase;

    letter-spacing: 1vw;

    line-height: 1.2;

    font-size: 3vw;

    text-align: center;

    }

    See the Pen Thiết Lập Video Background Với Nội Dung by haycuoilennao19 (@haycuoilennao19) on CodePen.

    Nguồn Thiết Lập Video Background Với Nội Dung

    /*Thiết lập video toàn màn hình*/

    #video {

    position: fixed;

    right: 0;

    bottom: 0;

    min-width: 100%;

    min-height: 100%;

    }

    /*Thêm một số nội dung phía dưới video */

    .noi_dung {

    position: fixed;

    bottom: 0;

    background: rgba(0, 0, 0, 0.5);

    color: #f1f1f1;

    width: 100%;

    padding: 20px;

    }

    /* thiết kế nút */

    #myBtn {

    width: 200px;

    font-size: 18px;

    padding: 10px;

    border: none;

    background: #000;

    color: #fff;

    cursor: pointer;

    }

    /*hiệu ứng hover cho nút*/

    #myBtn:hover {

    background: #ddd;

    color: black;

    }

    /*Lấy phần tử video*/

    var video = document.getElementById("video");

    /* lấy phần tử nút */

    var nut = document.getElementById("myBtn");

    /*thiết lập trạng thái video và nội dung hiển thị cho nút*/

    function myFunction() {

    if (video.paused) {

    video.play();

    nut.innerHTML = "Dừng";

    } else {

    video.pause();

    nut.innerHTML = "Phát";

    }

    }

    See the Pen Cách Thêm Các Nút Điều Khiển Cho Video Background by haycuoilennao19 (@haycuoilennao19) on CodePen.

    Nguồn Cách Thêm Các Nút Điều Khiển Cho Video Background

    Tổng kết:

    --- Bài cũ hơn ---

  • Thiết Kế Website Tổ Chức Giáo Dục
  • Cách Tạo Và Đăng Nhập Mail Icloud Trên Điện Thoại Android
  • Những Điều Cần Lưu Ý Trước Khi Tạo Email Theo Tên Miền Công Ty
  • Cách Tạo Email Theo Tên Miền Trên Google Miễn Phí
  • Cách Tạo Đường Link Trong WordPress 2022
  • Tạo File Làm Việc Trong Illustrator – Cách Tạo File Trong Ai

    --- Bài mới hơn ---

  • Cách Tạo Id Apple Mới Trên Điện Thoại, Máy Tính Cực Nhanh
  • Hướng Dẫn Tạo Và Kiếm Tiền Từ Blogspot Miễn Phí Cho Người Mới Bắt Đầu
  • Cách Nén File Và Giải Nén File
  • File Zip Là Gì? Cách Nén Và Giải Nén File Zip Cho Người Mới
  • Trình Chuyển Đổi Hình Ảnh Sang Jpg
  • Tạo file làm việc trong Illustrator – Cách tạo file trong AI

    File làm việc trong illustrator

    File làm việc trong Illustrator gọi là Ducument (tài liệu). Là một vùng không gian làm việc bao gồm 1 hay nhiều trang (artboad). Chúng được tạo ra với các thuộc tính riêng giúp người dùng có thể thao tác và tạo ra các bản thiết kế. Đối với illustrator File làm việc bao gồm cả trang và vùng nháp. Có nghĩa là bạn có thể vẽ hay tạo bất cứ đối tượng nào trong không gian bên trong và bên ngoài trang giấy.

    Một số khái niệm cần nắm được về File trong illustrator.

    Illustrator là một phần mềm đồ hoạ vector. Chính vì vậy chúng có những đặc điểm riêng mà các phần mềm khác không có. Phần mềm cho phép bạn vẽ và tạo ra các đối tượng bên ngoài khu vực trang giấy. Khu vực này được gọi là vùng nháp. Chính vì vậy khi thiết kế với illustrator bạn cần lưu ý các vấn đề sau.

    Trang giấy hay vùng thiết kế trong AI

    Đây là khu vực được quy định với kích thước, hình dáng và tỉ lệ nhất định. Vì là phần mềm đồ hoạ vector, chính vì vậy bạn không cần tạo ra một trang giấy với kích thước. Bạn chỉ cần quan tâm đến tỉ lệ của các chiều của trang giấy (khu vực làm việc) là được. Ví dụ bạn cần làm file 5mx2m bạn chỉ cần tạo 1 file 50cm x 20cm. Thậm chí là nhỏ hơn.

    Chú ý khi thiết kế. 

    Khi bạn thiết kế trong illustrator, bạn cần xác định chính xác việc bạn muốn xuất ra file ảnh, hoặc file in như thế nào. Nếu bạn cần một file in có kích thước như kích thước trang giấy bạn thiết lập. Bạn cần để tất cả bản thiết kế của mình trong trang giấy. Những gì ở bên ngoài trang giấy có thể bị loại bỏ sau khi bạn xuất file trong illustrator. 

    Lưu ý khi thiết kế trong illustrator có sử dụng ảnh

    Trong quá trình thiết kế nếu bạn sử dụng hình ảnh bạn cần tạo ra một thư mục thiết kế riêng trong máy tính. Thư mục này chứa toàn bộ hình ảnh và cả file thiết kế của bạn. Vì nếu bạn chèn ảnh vào illustrator mà không để ý có thể dẫn đến hiện tượng mất link ảnh (không còn ảnh); nếu sau này muốn mở lại file thiết kế cũ.

    Cách tạo một file làm việc trong illustrator.

    Các bước tạo một file làm việc mới trong illustrator

    Bước 1: Mở phần mềm illustrator

    Bước 2: Mở bảng điều khiển tạo file làm việc trong illustrator

    Bước 3: Thiết lập các thuộc tính cho file làm việc

    Trong file document  hiện ra bạn thiết lập các thông số cơ cho file làm việc mới với khu vực cơ bản, và khu vực nâng cao. Với khu vực thiết lập cơ bản bạn cần chú ý đến các thuộc tính như sau.

        • Preset details: Bạn đặt tên cho file làm việc mới trong illustrator của mình.
        • Width: Chiều rộng của file thiết kế với đơn vị đo ngay bên cạnh của lựa chọn này.
        • Height: Chiều cao của file thiết kế trong illustrator.
        • Orientation: Là hướng của giấy theo chiều ngang hoặc theo chiều dọc
        • Color mode: Thiết lập hệ màu cho file làm việc mới trong illustrator
        • Raster effect: Thiết lập độ phân giải Cho file làm việc.
        • Preview mode: Chế độ hiển thị cho file thiết kế. Phần này bạn nên để mặc định, bạn chỉ cần view print hoặc pixel trong những trường hợp đặc biệt thôi.

    Bước 4: Lưu file làm việc vừa tạo trong illustrator.

    Kết luận về cách Tạo file làm việc trong Illustrator

    Như vậy Tự học Đồ Hoạ vừa cùng các bạn tìm hiểu về cách tạo file làm việc trong illustrator. Đây là cách để tạo file làm việc cơ bản nhất chung nhất cho tất cả các phiên bản. Mong rằng với những chia sẻ của chúng tôi sẽ giúp các bạn có thêm thật nhiều kiến thức hữu ích trong quá trình học tập và làm việc của mình. Đừng quên để lại ý kiến đóng góp của bạn bên dưới để chúng tôi có thể học hỏi và rút kinh nghiệm.

    --- Bài cũ hơn ---

  • 30 Cách Tạo Dáng Chuẩn Cho Người Mẫu Nữ Khi Chụp
  • Cách Buộc Gà Cúng Theo Kiểu Gà Chầu, Gà Cánh Tiên, Gà Quỳ, Gà Bay
  • Hướng Dẫn Tạo Form Đăng Ký, Đăng Nhập Thêm Xóa Sửa Crud Sử Dụng Database Firebase Realtime
  • Form Trong Lập Trình C# Winform
  • Hướng Dẫn Tạo Một Project Mới
  • Tạo File Làm Việc Trong Photoshop – Cách Tạo File Trong Ps

    --- Bài mới hơn ---

  • Rss Là Gì? Cách Tạo Rss Cho Website
  • Rss Là Gì? Cách Cài Đặt, Sử Dụng Và Lấy Rss Feeds Cho WordPress
  • Trình Chuyển Đổi Hình Ảnh Svg Trực Tuyến
  • Gợi Ý 2 Phần Mềm Làm Sub Cho Video Tốt Nhất 2022 Và Cách Sử Dụng Cụ Thể
  • File Txt Là Gì? Tất Tật Những Gì Bạn Cần Biết Về File Txt
  • Tạo file làm việc trong Photoshop – Cách tạo file trong Ps

    Tạo file làm việc trong photoshop, hay còn gọi là tạo vùng làm việc mới trong Ps được thực hiện như thế nào? Cùng Tự Học Đồ Hoạ tìm hiểu những cách tạo vùng làm việc  trong Ps.

    1. File làm việc trong photoshop

    File làm việc trong photoshop gọi là Ducument (tài liệu). Là một vùng làm việc được tạo ra với các thuộc tính như kích thước, độ phân giải, hệ màu… Việc này giúp bạn có thể tạo ra những bức ảnh hoặc file thiết kế với thuộc tính định sẵn. Mọi thao tác chỉnh sửa, thiết kế sau này của bạn sẽ không vượt ra khỏi vùng làm việc được tạo.

    Một số khái niệm cần nắm được.

    Trước khi tạo một file làm việc trong photoshop bạn cần hiểu một số khái niệm cơ bản như sau: Kích thước file làm việc, tỉ lệ file làm việc, độ phân giải, hệ màu. Cụ thể như sau:

    Kích thước file làm việc

    Kích thước file làm việc là kích thước thực tế của file tài liệu được xuất ra (ảnh, pdf,…). Kích thước của file làm việc được quy định bởi 2 giá trị gồm width và height. Quy ước khi viết kích thước của file ảnh là rộng viết trước dài viết sau. Ví dụ 1 bức ảnh có kích thước 15x20cm, có nghĩa là bức ảnh có chiều rộng là 15cm, chiều cao là 20cm. Tương tự khi bạn nghe thiết kế banner kích thước file 900x603px (banner qc facebook). Thì điều này đồng nghĩa file ảnh sẽ có kích thước rộng 900px, cao 603px

    Tỉ lệ file làm việc.

    Tỉ lệ file làm việc được quy định bởi thông số chiều rộng chia chiều cao: width : height. Đa số khi người ta nói đến thiết kế 1 file với kích thước nào đó là họ đang nói đến tỉ lệ của file. Có nghĩa là khi khách hàng họ nói thiết kế file kích thước 1×2 mét. Có nghĩa là bạn cần phải thiết kế 1 file có tỉ lệ là 1:2 chứ không phải bắt buộc bạn phải tạo 1 file có kích thước 1×2 mét.

    Vậy nếu không thiết kế hoặc tạo 1 file làm việc với đúng kích thước khách hàng yêu cầu thì làm sao? Bạn cần lưu ý rằng ở một chừng mực nào đó kích thước file phụ thuộc vào máy in chứ không phải ở file in. Máy in sẽ có tỉ lệ in thu phóng nhất định, phụ thuộc vào tỉ lệ các chiều của file thiết kế. Nếu khách hàng yêu cầu bạn làm 1 băng rôn kích thước 30×1,5 mét thì bạn không thể tạo được 1 file như vậy trong photoshop.

    Độ phân giải của file làm việc trong photoshop.

    Độ phân giải là mật độ điểm ảnh (số pixel) trên một đơn vị chiều dài. Độ phân giải thường được quy định bởi số pixel trên 1 ich . Lưu ý rằng độ phân giải là số peixel trên 1 đơn vị chiều dài chứ không phải đơn vị diện tích.

    Đối với các thiết kế hiển thị, có nghĩa là file được tạo ra với mục đích đăng tải lên các thiết bị hiển thị; bạn để mật độ điểm ảnh là 72px / inch. Đối với các file sử dụng cho in ấn mật độ điểm ảnh thường là 150 hoặc 300px

    2. Tạo file làm việc trong Photoshop

    Để có thể tạo file làm việc mới trong photoshop bạn thường có 2 cách: Tạo file làm việc với kích thước định trước và tạo file làm việc với kích thước của bức ảnh cho trước. Mỗi một phiên bản của phần mềm sẽ có giao diện hơi khác nhau một chút. Trong trường hợp này tôi sẽ chia sẻ cho các bạn về 2 trường hợp khác nhau cho các phiên bản cũ và mới.

    Tạo file làm việc trong photoshop cc2014, cs6, cs5, cs3…

    Trước tiên chúng ta sẽ cùng nhau tìm hiểu về tạo file làm việc cho các phiên bản photoshop cũ, từ CC2014 trở về trước.

    Bước 1: Truy cập bảng điều khiển.

    Lưu ý rằng bạn có thể tạo một file làm việc mới khi bạn mới khởi chạy phần mềm; hoặc đang làm việc với một file làm việc khác.

    Bước 2: Thiết lập thông số cho file làm việc mới trong photoshop

    Sau khi bạn đã mở bảng quản lý document; bạn cần thiết lập các thống số cho file làm việc của mình như sau:

    Name: Là lựa chọn cho phép bạn đặt tên cho file làm việc của mình

    Preset: Cho phép bạn lựa chọn các chế độ với kích thước mà photoshop thiết lập sẵn. Trong trường hợp bạn muốn xét một kích thước tự do bạn chọn custom

    Size: Là lựa chọn các tỉ lệ hoặc kích thước có sẵn với các kích thước mặc định cho chết độ ở pset. Nếu bạn chọn custom sẽ không có chế độ này

    Dimensions (Width/Height): Thuộc tính cho phép bạn thiết lập kích thước của file làm việc. Đồng thời bạn sẽ xét đơn vị chiều dài mà bạn mong muốn

    Resolution: Như đã nói ở phần 1 resolution là mật độ điểm ảnh của file làm việc mà bạn muốn thiết lập.

    Color Mode: Là thiết lập hệ màu cho file làm việc của bạn. Nếu file của bạn để hiển thị trên các thiết bị điện tử bạn để RGB. Nếu dùng cho in ấn bạn sử dụng hệ màu CMYK.

    Background Contents: Là lựa chọn cho phép bạn thiết lập màu nền (background). cho file làm việc của bạn

    Tạo file việc mới trong photoshop với các phiên bản mới.

    Những tính năng có trong bảng new ducument photoshop

    Phiên bản mới photoshop gần đây cho phép bạn có thêm nhiều lựa chọn mới. Với các khả năng chuyên biệt hoá tính năng sử dụng nhằm hỗ trợ tốt hơn cho người dùng bao gồm:

    Tạo tài liệu với các mẫu có sẵn: Trong cập nhật mới photoshop cho phép bạn có nhiều hơn các sự lựa chọn như:  Ảnh, In, Nghệ thuật & Minh họa, Web, Di động và Phim & Video.

    Cung cấp thư viện tài liệu: Không chỉ cho phép sử dụng các tài liệu mới. Photoshop cho phép tìm thêm các mẫu có sẵn, và sử dụng chúng làm file tài liệu của mình trong adbe stock

    Lưu lại thuộc tính file đã tạo: Không chỉ cho phép bạn sử dụng các kích thước file  mặc đinh. Bạn có thể tạo file làm việc mới và lưu lại các thuộc tính của file làm việc đó. Việc này giúp bạn nhanh chóng tạo những file mới với thuộc tính giống với file làm việc cũ

    Tạo file làm việc sử dụng cài đặt trước của photoshop.

    – Tiếp theo bạn có thể xem và sửa các thiết lập cho cài đặt của mình.

    – Chọn Create để khởi tạo file làm việc mới trong photoshop.

    Tạo file làm việc bằng tự thiết lập trong photoshop

    Trong hộp thoại new ducument bạn chọn recent hoặc print và thiết lập các thuộc tính cho file làm việc của mình. Trong đó có phần cơ bản như sau: Preset Details panelAdvanced Options. 

    Thiết lập tuỳ chọn chung Preset Details panel

    Width and Height: Thiết lập kích thước của tài liệu. Đồng thời chọn đơn vị từ menu bật lên.

    Orientation: Chỉ định hướng trang cho tài liệu: Phong cảnh hoặc Chân dung

    Artboards: Chọn tùy chọn này nếu bạn muốn tài liệu của mình khi bạn cần 1 trang có bản vẽ. Photoshop thêm một bản vẽ trong khi tạo tài liệu.

    Color Mode: thiết lập hệ màu cho tài liệu của bạn

    Resolution: Mật độ điểm ảnh của tài liệu mà bạn tạo ra.

    Background contents: Thiết lập màu sắc màu nền (background) trong photoshop.

    Thiết lập tuỳ chọn nâng cao Advanced Options. 

    Color Profile: Chỉ định cấu hình màu cho tài liệu của bạn, từ một loạt các tùy chọn trong cài đặt của bạn.

    Pixel Aspect Ratio: Chỉ định tỷ lệ chiều rộng và chiều cao của một pixel trong khung trong thiết lập của bạn.

    Kết luận

    Như vậy Tự Học Đồ Hoạ vừa cùng các bạn đi tìm hiểu cáchTạo file làm việc trong photoshop. Tạo file làm việc mới trong photoshop hay còn gọi là tạo vùng làm việc mới trong Ps. Mong rằng với những chia sẻ của Tự học Đồ hoạ sẽ giúp ích được các bạn phần nào trong quá trình học tập và làm việc của mình

    --- Bài cũ hơn ---

  • Gửi Tặng Chương Trình Tạo File Ntd
  • Hướng Dẫn Tạo Bản Quyền (License Product) Bảo Mật Ứng Dụng.
  • Tổng Quan Về Log, Syslog, Rsyslog, Log Tập Trung
  • Config Log Và Đường Dẫn File Log
  • Chuyển Đổi File Hình Ảnh Của Bạn Sang Định Dạng Ico
  • Cách Sử Dụng Css Trong Trang Web Html

    --- Bài mới hơn ---

  • Các Cách Viết Css Trong Trang Web
  • Khám Phá File Cmd/bat (Phần 2): Những Tiện Ích Của Cmd/bat File Mà Bạn Chưa Biết
  • Cách Chuyển Đổi Dbf Sang Pdf Bằng Máy In Pdf
  • Nguyễn Phùng Hưng Blog
  • Tệp .ini Là Gì Và Làm Cách Nào Để Mở Nó?
  • Khái niệm property, value, selector

    Property là thuộc tính của phần tử HTML, ví dụ:

    • font-size (kích cỡ chữ của phần tử)
    • color (màu chữ của phần tử)
    • background-color (màu nền của phần tử)
    • …..

    Value là giá trị của thuộc tính.

    Selector (bộ chọn) là phần tử mà bạn muốn định dạng.

    Ví dụ:

    Trong đoạn mã phía dưới:

    • Bộ chọn là h1
    • Có 3 thuộc tính là font-size, color, background-color với giá trị lần lượt là 30px, white, red

    h1 { font-size:30px; color:white; background-color:red; }

    Xem ví dụ

    Cú pháp định dạng phần tử

    Để định dạng cho một phần tử, ta sử dụng cú pháp như sau:

    selector { property1: value; property2: value; property3: value; ..... propertyN: value; }

    Ví dụ:

    h1 { font-size:30px; color:white; background-color:red; } p { background-color:gray; }

    Xem ví dụ

    Lưu ý:

    • Phía sau mỗi cặp property:value phải được kết thúc bởi dấu chấm phẩy (;)
    • Vấn đề xuống dòng và khoảng cách trong CSS là không quan trọng, đoạn mã ở ví dụ phía trên có thể viết lại như sau.

    h1{font-size:30px;color:white;background-color:red;}p{background-color:gray;}

    Cách sử dụng CSS

    Có ba cách sử dụng css: Inline CSS, Internal CSS, External CSS

    1) Inline CSS

    Ta đặt các cặp property:value vào bên trong thuộc tính style nằm ở thẻ mở của phần tử.

    Ví dụ:

    Xem ví dụ

    2) Internal CSS

    Ví dụ:

    h1 {

    font-size:30px;

    color:white;

    background-color:red;

    }

    p {

    background-color:gray;

    }

    Xem ví dụ

    3) External CSS

    Đặt các bộ định dạng CSS vào bên trong một tập tin css

    Ví dụ, tôi có một tập tin css nằm cùng cấp với tập tin html

    Tập tin css có tên là dinhdang và chứa nội dung như sau:

    h1 { font-size:30px; color:white; background-color:red; } p { background-color:gray; }

    Để nhúng tập tin css phía trên vào trang web thì ở tập tin html sẽ có nội dung như sau:

    Lưu ý:

    • Cách tạo tập tin css giống với cách tạo tập tin html (chỉ thay .html bằng .css)

    Thứ tự ưu tiên giữa các cách sử dụng CSS

    Nếu một thuộc tính nào đó của phần tử được thiệt lập giá trị bởi nhiều cách, thì thuộc tính đó sẽ nhận giá trị của cách sử dụng CSS dựa theo độ ưu tiên như sau:

    • 1) Inline
    • 2) Internal
    • 3) External

    Ví dụ:

    h1 {

    color:red;

    }

    Xem ví dụ

    Thứ tự ưu tiên trong một bộ định dạng

    Trong một bộ định dạng của một phần tử, nếu một thuộc tính nào đó bị viết lập lại nhiều lần, thì thuộc tính đó sẽ nhận giá trị ở lần viết cuối cùng.

    Ví dụ:

    h1 { color:red; font-size:25px; color:green; }

    Xem ví dụ

    Kế thừa giá trị thuộc tính từ phần tử tổ tiên

    Thông thường, nếu một phần tử không thiết lập giá trị cho thuộc tính thì thuộc tính đó sẽ nhận giá trị từ giá trị thuộc tính của phần tử chứa nó và ở gần nó nhất.

    Ví dụ:

    Xem ví dụ

    Cách ghi chú thích

    Khi bạn muốn vô hiệu hóa một số mã CSS với mục đích nào đó (chẳng hạn như để ghi nhớ, chú thích, hoặc test code) thì bạn đặt chúng vào bên trong cặp dấu /* */

    Ví dụ:

    Đoạn CSS nào nằm bên trong cặp dấu /* */ sẽ bị vô hiệu hóa

    h1 { /*color:red; font-size:50px;*/ background-color:blue; /*Đây cũng là một câu chú thích*/ }

    Xem ví dụ

    --- Bài cũ hơn ---

  • File .bat Là Gì? Tạo File Bat Sửa Lỗi Thông Dụng Tự Động
  • Làm Thế Nào Để Mở Tập Tin .asc? Về Đuôi :ex
  • Trung Tâm Kỹ Thuật Tài Nguyên & Môi Trường Đồng Tháp
  • Cách Chuyển Đổi Asc Sang Pdf Bằng Máy In Pdf
  • Hướng Dẫn Từng Bước Tạo Form Đăng Ký Trên Web
  • Web hay
  • Links hay
  • Push
  • Chủ đề top 10
  • Chủ đề top 20
  • Chủ đề top 30
  • Chủ đề top 40
  • Chủ đề top 50
  • Chủ đề top 60
  • Chủ đề top 70
  • Chủ đề top 80
  • Chủ đề top 90
  • Chủ đề top 100
  • Bài viết top 10
  • Bài viết top 20
  • Bài viết top 30
  • Bài viết top 40
  • Bài viết top 50
  • Bài viết top 60
  • Bài viết top 70
  • Bài viết top 80
  • Bài viết top 90
  • Bài viết top 100
  • CẦM ĐỒ TẠI F88
    15 PHÚT DUYỆT
    NHẬN TIỀN NGAY

    VAY TIỀN NHANH
    LÊN ĐẾN 10 TRIỆU
    CHỈ CẦN CMND

    ×