Bài giảng Lập trình web toàn tập với HTML, CSS, Jquery, Responsive, Bootstrap Chương 4: HTML căn bản và bài tập

Bài giảng Lập trình web toàn tập với HTML, CSS, Jquery, Responsive, Bootstrap Chương 4: HTML căn bản và bài tập trình bày các nội dung chính sau: Khái niệm HTML, cấu trúc của HTML, các tag cơ bản và những bài tập HTML cơ bản dành cho người mới bắt đầu. Mời các bạn cùng tham khảo để nắm nội dung chi tiết.

Download miễn phí có ilook.asia CHƯƠNG 4: HTML CĂN BẢN VÀ BÀI TẬP |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG KỸ THUẬT CAO THẮNG 49 Download miễn phí có ilook.asia HTML LÀ GÌ Giới thiệu HTML !  HTML (Hyper Text Markup Language) Ngôn ngữ đánh dấu siêu văn !  Là ngôn ngữ dùng để xây dựng trang Web !  Chứa thành phần định dạng để báo cho trình duyệt Web biết cách để hiển thị trang Web !  Một trang web thơng thường gồm có thành phần chính: !  Dữ liệu trang web (văn bản, âm thanh, hình ảnh ) !  Các thẻ (tag) HTML dùng để định dạng mô tả cách thức liệu hiển thị trình duyệt |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 50 Download miễn phí có ilook.asia Cơng cụ thực website ! Notepad++ ! Dreamweaver ! CotEditor (Macbook) ! Pingendo (support bootstrap) |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 51 Download miễn phí có ilook.asia Cấu trúcCấu trúc tàitài liệu HTML liệu HTML !  : Định nghĩa phạm vi văn HTML !  : Định nghĩa mô tả trang HTML Thông tin tag không hiển thị trang web !  : Mô tả tiêu đề trang web !  : Xác định vùng thân trang web, nơi chứa thơng tin |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 52 Cấu trúc tài liệu HTML Download miễn phí có ilook.asia Cấu trúc tài liệu HTML Tiêu đề Phần đầu trang HTML Nội dung Nội dung Nội dung Bắt đầu Kết thúc trang HTML Nội dung trang HTML |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 53 Download miễn phí có ilook.asia Thẻ (Tag) HTML Các tag (thẻ) - phần Thẻ mở Giá trị thuộc tính Thẻ đóng Dòng chữ in đậm màu xanh Tên thuộc tính !  Tên thẻ & thuộc tính !  Thường mang tính gợi nhớ "  B ~ Bold, I ~ Italic, P ~ Paragraph !  Không phân biệt HOA thường !  Một số thẻ đơn khơng có thẻ đóng !  •  Giá trị Thuộc tính Thẻ nên đặt dấu nháy đơn ‘’ nháy kép “” |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 54 Download miễn phí có ilook.asia Giới thiệu HTML – Thẻ (Tag) Các tag (thẻ) - phần HTML.Cú pháp Mã#HTML# Hiển#thị# $Đây$là$một$dòng$được$in$Đậm$ Đây#là#một#dòng#được#in#Đậm# $Mức$chữ$ở$@êu$đề$3$$ Mã#HTML# Mức$chữ$ở$@êu$đề$3$$ Hiển#thị# $ Hello#World$ $Hello$ $$$$$$$$$$$$$$$$$$$$$$$$$$$$$World$ $ Lưu ý : • Bỏ qua khoảng trắng thừa dấu ngắt dòng, xuống dòng |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 55 Download miễn phí có ilook.asia Thực hành cấu trúc HTML đơn giản CÁC BẠN THỰC HIỆN THEO VIDEO |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 56 Download miễn phí có ilook.asia Thực hành cấu trúc HTML đơn giản |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 57 Download miễn phí có ilook.asia Các tag xử lý văn – Khối, Các tag (thẻ) - phần chuỗi văn !  Các thẻ định dạng khối văn – Block Element !  Tiêu đề (Heading) : , , , , , !  Đoạn văn (Paragraph):

!  Danh sách (List Items):

!  Đường kẻ ngang (Horizontal Rules): !  Các thẻ định dạng chuỗi văn – Inline Element !  Định dạng chữ : , , , !  Tạo siêu liên kết : !  Xuống dòng : |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học CAO lập trình trực tạiCAO itclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG ĐẲNG KỸtuyến THUẬT THẮNG 58 Download miễn phí có ilook.asia Check box ! Checkbox  Field Cú$pháp$ ! $ Ví$dụ$$ Check box group : Anh van: Hoa: Nhut: |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 102 Radio button ! Download miễn phí có ilook.asia RadioBuTon  Field Cú$pháp$ ! Ví$dụ$ Radio Button Group : Nam: Nu: |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 103 Download miễn phí có ilook.asia RadioBuTon  Field baitapform2 |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 104 Download miễn phí có ilook.asia File upload Control File  Upload  Control !  !  Dùng$để$upload$1$file$lên$server$ Cú$pháp$ !  Ví$dụ$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 105 Submit button Download miễn phí có ilook.asia Submit  BuTon ! ! ! ! Nút$phát$lệnh$và$gởi$dữ$liệu$của$form$đến$ trang$xử$lý.$ Mỗi$form$chỉ$có$một$nút$submit$và$nút$này$ được$viền$đậm$ Cú$pháp:$ $ $ Ví$dụ:$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 106 Reset Button Download miễn phí có ilook.asia Reset  BuTon ! ! Dùng$để$trả$lại$giá$trị$mặc$định$cho$các$control$ khác$trong$form$ Cú$pháp$ $ ! Ví$dụ$$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 107 Download miễn phí có ilook.asia Generalized Button BuTon  tổng  quát !  Cú$pháp$ !  Ví$dụ$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 108 Download miễn phí có ilook.asia Multiline Text Field MulYline  textfield ! ! Dùng$để$nhập$văn$bản$nhiều$dòng$ Cú$pháp$ …………… 20$ Ví$dụ$$ This is a text on multiline $ 5$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 109 Download miễn phí có ilook.asia Pull-down Menu Combobox-­‐  Dropdown  box !  !  Dùng$để$tạo$ra$một$combo$box$ Cú$pháp$ …… ……… …… ……… |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 110 Download miễn phí có ilook.asia Pull-down Menu Combobox-­‐  Dropdown  box combo box: Window Media 10 Jet Audio 9 Windows XP Windows XP SP2 Windows Vista Office 2007 |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 111 Download miễn phí có ilook.asia Phương  thức  Get/Post  trong  Form Phương thức GET Phương thức GET ! ! Các$đối$số$của$Form$được$ghi$chèm$theo$vào$đường$ dẫn$URL$của$thuộc$}nh$AcZon$trong$tag$$ Khối$lượng$dữ$liệu$đối$số$được$truyền$đi$của$Form$bị$ giới$hạn$bởi$chiều$dài$tối$đa$của$một$URL$trên$Address$ bar.$$ !  !  !  !  !  !  IE$:$Tối$đa$của$một$URL$là$2.048$ký$tự$ Firefox$:$Tối$thiểu$của$một$URL$là$khoảng$100.000$ký$tự$ Safari$:$Tối$thiểu$của$một$URL$là$80.000$ký$tự$ Opera$:$Tối$thiểu$của$một$URL$là$190.000$ký$tự$ Apache$Server$:$Tối$đa$của$một$URL$là$8.192$ký$tự$ IIS$Server$:$Tối$đa$của$một$URL$là$16.384$ký$tự$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 112 Download miễn phí có ilook.asia Demo  phương  thức  GET |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 113 Download miễn phí có ilook.asia Phương  thức  Get/Post  trong  Form Phương thức POST Phương thức POST !  !  !  Các$đối$số$của$Form$được$truyền$“ngầm”$bên$ dưới$ Khối$lượng$dữ$liệu$đối$số$được$truyền$đi$của$ Form$khơng$phụ$thuộc$vào$URL$!$Khơng$bị$giới$ hạn$ Chỉ$sử$dụng$được$phương$thức$truyền$POST$khi$ AcZon$chỉ$định$đến$trang$web$thuộc$dạng$trang$ web$có$mã$lệnh$xử$lý$trên$Server$ |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 114 Download miễn phí có ilook.asia Demo  phương  thức  POST |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Học lập trình trựcKỸ tuyến myclass.vn |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG THUẬT CAO THẮNG 115 Download miễn phí có ilook.asia CSS |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| TRƯỜNG CAO ĐẲNG KỸ THUẬT CAO THẮNG 116 ... name: tải trang web vào frame có tên NAME _blank: tải trang web vào cửa sổ _parent: tải trang web vào cửa sổ cha _self: tải trang web vào cửa sổ hành _top: tải trang web vào cửa số cao Ví dụ... liệu HTML liệu HTML !  < /html> : Định nghĩa phạm vi văn HTML !  : Định nghĩa mô tả trang HTML Thông tin tag không hiển thị trang web !  : Mô tả tiêu đề trang web. .. hay Học lập trình, theo dành riêng cho bạn theo nghề lập trình mà tơi nghĩ tốt cho tất người Học lập trình giúp tất xử lý vấn đề logic, tư logic Ngày thứ phát triển dựa vào cơng nghệ, dựa vào máy