HTML

Chia sẻ bởi Trần Thị Nhị Hường | Ngày 19/03/2024 | 10
Chia sẻ tài liệu: HTML thuộc Công nghệ thông tin

Nội dung tài liệu:

Tìm hiểu về ngôn ngữ lập trình HTML:
Cấu trúc trang web:


tiêu đề trang web


Thân trang web


…

TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ
KHOA CÔNG NGHỆ THÔNG TIN
Cú pháp tag tổng quát:
Cú pháp tag tổng quát của một tag:
chuỗi văn bản tên_tag gõ vào dạng chữ thường hoặc hoa đều được và các tag có thể lồng vào nhau.
Tạo đầu trang :
Tag ở đầu trang web tĩnh và ở cuối trang .
Trang web được bắt đầu và kết thúc bởi trang này.
TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ
KHOA CÔNG NGHỆ THÔNG TIN
Tag bắt đầu :
Tag đánh dấu điểm bắt đầu phần_đầu_Heading của trang web.
Tag tiêu đề :
Tag chỉ định tiêu đề của trang web<br>Tiêu đề này sẽ xuất hiện trên thanh tiêu đề của trình duyệt<br>Tag này chỉ hợp lệ khi đưa vào bên trong phần <head>.<br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag thân trang<body> </body>:<br> Dùng chỉ định bắt đầu và kết thúc phần nội dung trang web này được định nghĩa như sau:<br> <BODY<br> BACKGROUD= url<br> BGCOLOR = color<br> BGPROPERTIES = FIXED<br> LEFT MARGIN = n<br> LINK =color<br> TOPMARGIN = n<br> VLINK = color><br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag xuống dòng sang đoạn mới <p> </p>:<br>Ngắt văn bản sang đoạn mới<br>Thành phần </P> cuối đoạn không nhất thiết phải có<br>Tag này được định nghĩa như sau:<br> <p align_align_type>, ALIGN= align_type dùng chỉ định canh đoạn mới .<br> Align_type =LEFT (canh trái)<br> RIGHT (canh phải)<br> CENTER (canh giữa).<br> <br> <br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag xuống dòng không sang đoạn mới <br> </BR>:<br> Ngắt xuống dòng mới nhưng vẫn thuộc cùng một đoạn hiện hành<br> </BR> không nhất thiết phải có<br>Tag thêm đường thẳng nằm ngang <hr> </HR>:<br> Tag này được định nghĩa như sau:<br> <HR<br> ALIGN = align-type<br> COLOR = color<br> NOSHADE<br> SIZE = n<br> WIDTH = m><br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag đậm <b> </b>:<br> Hiển thị văn bản đậm phisical type<br>Tag nghiêng <i> </i>:<br> Hiển thị văn bản nghiêng theo phisical type<br>Tag gạch dưới <u> </u>:<br> Hiển thị văn bản gạch dưới theo phisical type<br>Tag gạch giữa <s> </s>:<br> Hiển thị văn bản gạch giữa theo phisical type<br>Tag đậm logic type <strong> </strong><br> Hiển thị văn bản đậm theo logic type<br><br><br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag nghiêng logic type <em> </em>:<br> Hiển thị văn bản nghiêng theo logic type<br>Tag gạch ngang logic type <strike> </strike> :<br> Hiển thị văn bản ngang theo logic type<br>Tag chỉ số logic type <sub> </sub>:<br> Hiển thị văn bản dạng chỉ số theo logic type<br>Tag mủ logic type <sup> </sup>:<br> Hiển thị văn bản dạng mủ theo logic type<br><br><br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag Font chữ <font></font>:<br> Chỉ định font, size, màu văn bản<br> <FONT<br> SIZE= n<br> FACE = name<br> COLOR = color<br>Tag định dạng bảng <table></TR><td></table><br> Sử dụng tag <table> để bắt đầu và kết thúc một bảng<br> Sử dung kèm theo với tag <tr></tr> để thêm một dòng trong bảng và tag <td></td> để thêm một ô trên dòng.<br> <br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>Tag 6 mức tiêu đề <hn></hn>:<br> Dùng để tạo các tiêu đề to nhỏ tuỳ ý theo cấp tiêu đề trong trang web <br> Có 6 cấp tiêu đề khác nhau được định nghĩa như sau:<br> <hn> Text xuất hiện trong tiêu đề </hn><br> Với N là số từ 1 đến 6<br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>TRƯỜNG CAO ĐẲNG SƯ PHẠM QUẢNG TRỊ<br>KHOA CÔNG NGHỆ THÔNG TIN<br>The end !!!<br>Chúc các bạn thành công.!!!<br></div> </div> </div> <div style="font-size:12px;">* Một số tài liệu cũ có thể bị lỗi font khi hiển thị do dùng bộ mã không phải Unikey ...</div> <hr> <div class="row"> <div class="ad-container"> </div> </div> <div class = 'clearfix'></div> <div class="row"> <div class="col-md-6 col-xs-12"> <div><b>Người chia sẻ</b>: <a href="#">Trần Thị Nhị Hường </a></div> <div><b>Dung lượng</b>: | <b>Lượt tài</b>: 0 </div> <div><b>Loại file</b>: </div> <div><b>Nguồn</b> : Chưa rõ </div> <div style="font-size:12px;">(Tài liệu chưa được thẩm định)</div> </div> <div class="col-md-6 col-xs-12"> <div class="btn-preview download-file-btn" style="width:150px;background:#f26c4f;margin:3px;" data-lesson-id = "65f8aeef11f691ad6f8b50e0"> <a data-href="https://thuviengiaovien.com/lesson/download/id/65f8aeef11f691ad6f8b50e0" href= "javascript:void(0)" style="color:#fff;" rel="nofollow"> <i class="fa fa-download" aria-hidden="true" style="font-size:20px;"></i> Tải tài liệu </a> </div> <div><a href="#">Báo cáo sai sót </a></div> <div><a href="#">Đề suất chỉnh sửa , phân lại mục</a> </div> </div> </div> </div> </div> </div> <div class="u-face-cm lazy"> <div class="fb-like" data-href="https://thuviengiaovien.com/html-1058649.html" data-layout="standard" data-action="like" data-show-faces="false" data-share="true" data-width="300"> </div> <div class="fb-comments" data-href="https://thuviengiaovien.com/html-1058649.html" data-width="100%" data-numposts="5" data-colorscheme="light"> </div> </div> </div> <div class="col-lg-4 col-md-4 col-sm-12 pdr-b hidden-xs"> <div class="u-learn-what"> <div class="alert alert-success" role="alert"> <h3>Thư Viện Giáo viên có gì ?!</h3> <hr style="margin:3px 0px;"> <div><i class="fa fa-check" aria-hidden="true"></i> Thư viện tài liệu giáo viên đủ các bậc học </div> <hr style="margin:3px 0px;"> <div><i class="fa fa-check" aria-hidden="true"></i> Tải và chia sẻ tài liệu miễn phí , lưu trữ không giới hạn ... </div> <hr style="margin:3px 0px;"> <div><i class="fa fa-check" aria-hidden="true"></i> Cộng đồng chia sẻ kinh nghiệm dạy học ... </div> <hr style="margin:3px 0px;"> <br /> <center><a class="unica-log-acc" href="/register">Tham gia thư viện > </a></center> </div> </div> <div class="u-learn-what"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-4649191202673214" data-ad-slot="2171434249" data-ad-format="auto" data-full-width-responsive="true"></ins> <script>(adsbygoogle=window.adsbygoogle||[]).push({});</script> </div> </div> </div> </div> </div> <br /> </main> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous"> <footer> <div id="footer2"> <div class="container"> <div class="row"> <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdl" style="padding-top:20px;"> <span class="logo-footer"> <a class="navbar-brand" href="/"><img src="/images/logo/logo-tv-gv.png" width="100%"></a> </span> <!--<ul> <li> <i class="fa fa-map-marker" aria-hidden="true"></i> <a href="#">Mai Dịch Cầy Giấy Hà Nội </a> </li> </ul>--> </div> <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdm des-unica"> <h4>Về chúng tôi </h4> <ul> <li><a href="/gioi-thieu">Giới thiệu</a></li> <li><a href="/faq">Câu hỏi thường gặp</a></li> <li><a href="/dieu-khoan-dich-vu.html">Điều khoản dịch vụ</a></li> <li><a href="/blog">Blog chia sẻ </a></li> </ul> </div> <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr pdm des-unica"> <h4>Hoạt động</h4> <ul> <li><a href="/teacher">Đăng ký / Đăng nhập </a></li> <li><a href="#" target="_blank">Đăng ký hợp tác </a></li> </ul> </div> <div class="col-lg-2 col-md-2 col-sm-2 col-xs-6 pdr des-unica"> <h4>Liên kết hữu ích </h4> <ul> <li><a href="#">Dạy online </a></li> </ul> <span class="social-connect"> <p>Kết nối với </p> <ul> <li><a href="https://www.facebook.com/hoctaphay/" data-bg-color="#3B5998" style="background: rgb(59, 89, 152) !important;"><i class="fa fa-facebook"></i></a></li> <li><a href="# data-bg-color="#C22E2A" style="background: rgb(194, 46, 42) !important;"><i class="fa fa-youtube"></i></a></li> </ul> </span> </div> <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 pdr facebook-box"> <div class="fb-page fb_iframe_widget" data-href="https://www.facebook.com/hoctaphay/" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" fb-xfbml-state="rendered" fb-iframe-plugin-query="adapt_container_width=true&app_id=1639709859601244&container_width=137&hide_cover=false&href=https%3A%2F%2Fwww.facebook.com%2Funica.vn%2F&locale=vi_VN&sdk=joey&show_facepile=true&small_header=false"><span style="vertical-align: bottom; width: 180px; height: 230px;"></span></div> </div> </div> </div> </div> <div id="footer3"> <div class="container"> <div class="row"> <div class="col-lg-10 col-md-10 col-sm-10 col-xs-12"> <p>© Thư viện giáo viên - Chia sẻ phướng pháp, tài liệu dạy học trực tuyến </p> </div> <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12"> -- </div> </div> </div> </div> </footer> <script type="text/javascript" src="/templates/default/new/js/jquery-3.2.1.min.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/bootstrap.min.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/slick.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/bootstrap.offcanvas.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/sidenav.min.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/amazonmenu.js?ver=201904261832"></script> <script type="text/javascript" src="/templates/default/new/js/sticky-sidebar.js?ver=201904261832"></script> <script type="text/javascript" src="/js/ViewerJS/viewerjs.js?ver=201904261832"></script> <script type="text/javascript"> $.fn.isOverflowed = function(){ var e = this[0]; return e.scrollHeight > e.clientHeight || e.scrollWidth > e.clientWidth; }; </script> <script type="text/javascript"> <!-- $(document).ready(function() { $('.download-file-btn').click(function(){ var _this = $(this); if(_this.data('downloading') != true){ _this.data('downloading',true); _this.data('downloading-error',0); $(this).find('i').addClass('fa-spinner'); $(this).find('i').addClass('fa-spin'); var callback = function(result){ console.log(result); if(result.success == true){ _this.data('downloading',false); // _this.find('i').removeClass('fa-spinner'); // _this.find('i').removeClass('fa-spin'); window.location.href = result.href; }else{ var error = _this.data('downloading-error'); if(error < 3){ _this.data('downloading-error',error + 1); getDownloadUrl({ id : _this.data('lesson-id'), },callback); } } }; getDownloadUrl({ id : _this.data('lesson-id'), },callback); } }); }); function getDownloadUrl(options,callback){ $.ajax({ url : '/lesson/get-download-info', type : 'POST', data : options, success : function(result){ callback(result); }, error : function(){ callback({success : false}); } }); } (function () { function b(a, b) { var c = new XMLHttpRequest; c.onreadystatechange = function () { var a, f; 4 === c.readyState && ((200 <= c.status && 300 > c.status || 0 === c.status) && (a = c.getResponseHeader("content-type")) && q.some(function (b) { return b.supportsMimetype(a) ? (f = b, console.log("Found plugin by mimetype and xhr head: " + a), !0) : !1 }), b(f)) }; c.open("HEAD", a, !0); c.send() } function r(a) { var b; q.some(function (c) { return c.supportsFileExtension(a) ? (b = c, !0) : !1 }); return b } function f(a) { var b = r(a); b && console.log("Found plugin by parameter type: " + a); return b } function x(a) { a = a.split("?")[0].split(".").pop(); var b = r(a); b && console.log("Found plugin by file extension from path: " + a); return b } function s(a) { var b = {}; (a.search || "?").substr(1).split("&").forEach(function (a) { a && (a = a.split("=", 2), b[decodeURIComponent(a[0])] = decodeURIComponent(a[1])) }); return b } var k, q = [function () { var a = "application/vnd.oasis.opendocument.text application/vnd.oasis.opendocument.text-flat-xml application/vnd.oasis.opendocument.text-template application/vnd.oasis.opendocument.presentation application/vnd.oasis.opendocument.presentation-flat-xml application/vnd.oasis.opendocument.presentation-template application/vnd.oasis.opendocument.spreadsheet application/vnd.oasis.opendocument.spreadsheet-flat-xml application/vnd.oasis.opendocument.spreadsheet-template".split(" "), b = "odt fodt ott odp fodp otp ods fods ots".split(" "); return { supportsMimetype: function (b) { return -1 !== a.indexOf(b) }, supportsFileExtension: function (a) { return -1 !== b.indexOf(a) }, path: "./ODFViewerPlugin", getClass: function () { return ODFViewerPlugin } } } (), { supportsMimetype: function (a) { return "application/pdf" === a }, supportsFileExtension: function (a) { return "pdf" === a }, path: "./PDFViewerPlugin", getClass: function () { return PDFViewerPlugin } } ]; $(document).ready(function() { if($('#preview_url').length != 0 && $('#viewer').length != 0 ){ var a = $('#preview_url').val(), e = { 'title' : $('#preview_title').val() }, c; if(a != '' && a != undefined ){ a ? (e.title || (e.title = a.replace(/^.*[\\\/]/, "")), e.documentUrl = a, b(a, function (b) { b || (b = e.type ? f(e.type) : x(a)); b ? "undefined" !== String(typeof loadPlugin) ? loadPlugin(b.path, function () { c = b.getClass(); new Viewer(new c, e) }) : (c = b.getClass(), new Viewer(new c, e)) : new Viewer })) : new Viewer } } }); k = document.createElementNS(document.head.namespaceURI, "style"); k.setAttribute("media", "screen"); k.setAttribute("type", "text/css"); k.appendChild(document.createTextNode(viewer_css)); document.head.appendChild(k); k = document.createElementNS(document.head.namespaceURI, "style"); k.setAttribute("media", "only screen and (max-device-width: 800px) and (max-device-height: 800px)"); k.setAttribute("type", "text/css"); k.setAttribute("viewerTouch", "1"); k.appendChild(document.createTextNode(viewerTouch_css)); document.head.appendChild(k) })(); //--> </script> <script> $(document).ready(function () { $(".remove-navibar").click(function () { $("#js-bootstrap-offcanvas").trigger("offcanvas.toggle"); }); }); jQuery(function () { amazonmenu.init({ menuid: 'mysidebarmenu' }) }) resizeWindow(); window.addEventListener('resize', resizeWindow); function resizeWindow() { $('.slider').slick({ responsive: [{ breakpoint: 2500, settings: "unslick" }, { breakpoint: 640, settings: { dots: true, infinite: true } } ] }); } $('.u-blog-slide').slick({ infinite: true, slidesToShow: 1, slidesToScroll: 1, responsive: [{ breakpoint: 1025, settings: { slidesToShow: 1, slidesToScroll: 1, infinite: true } }, { breakpoint: 769, settings: { slidesToShow: 1, slidesToScroll: 1 } }, { breakpoint: 480, settings: { slidesToShow: 1, slidesToScroll: 1 } } ] }); </script> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-114571019-15', 'auto'); ga('send', 'pageview'); </script> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=292835638303077"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> </html>