이 사진은 html 파일의 간단한 구조도를 보여줍니다(각 부분을 하나씩 설명하겠습니다). 일반적인 html 파일의 구조는 다음과 같습니다. 다음
<html>
<head>
<title>.....</title>
</head>
<body>
<p>.....</p>
</body>
</html>
코드 설명:
1. <html></html> 을 루트 태그라고 하며, 모든 웹페이지 태그는 <html></html> .
2. <head> 태그는 문서의 헤드를 정의하는 데 사용됩니다. 헤더 요소에는
, <script>, <style>, <link>, <meta> 및 기타 태그가 포함됩니다. 헤더 태그는 다음 섹션에서 자세히 소개됩니다. </p><p>3. <body>와 </body> 태그 사이의 내용은 <h1>, <p>, <a>와 같은 웹페이지의 주요 내용입니다. ;img> 웹 콘텐츠 태그를 기다리면 여기에 있는 태그의 콘텐츠가 브라우저에 표시됩니다. </p><p><br/></p> </div>
<div class="editorplayL_next">
<a href="//m.sbmmt.com/global/ko/code/425.html">지속적인 학습</a>
</div>
</div>
<div class="editorplayM js-editor-tab">
<div class="editor-right icon-right editor-op"></div>
<div class="editorplayM_top editor-view ">
<span class="ui-tabs-active">새로운 파일</span>
</div>
<div id="editor-tabs-html" data-filename="index.html" data-lang="php" style="font-size: 16px;height:600px"><html>
<head>
<title>PHP中文网</title>
</head>
<body>
<p>PHP中文网</p>
</body>
</html></div>
<div class="editor-right icon-right editor-op"></div>
<div class="editorplayM_button">
<a href="javascript:;" id="J_EditorReset" title="코드 재설정">코드 재설정</a>
<div>
<div>
<input type="checkbox" id="aotoruncheck" title="선택하면 코드 수정이 자동으로 적용됩니다. 선택하지 않은 경우 제출해야 적용됩니다.">
<span>자동운전</span>
</div>
<a href="javascript:;" id="J_Commit">제출하다</a>
</div>
</div>
</div>
<div class="editorplayR">
<div class="m_editormain12main_top">
<img src="/static/imghwm/logo.png" alt="logo" />
<a href="javascript:;" title="" id="editorplayR_close">
<i class="layui-icon layui-icon-close"></i>
</a>
</div>
<div class="editorplayR_top">
<span>시사</span>
<a href="javascript:;">Clear</a>
</div>
<div class="layui-col-md3" id="viewPort-content"></div>
</div>
</div>
<div class="videoplay_info">
<a href="//m.sbmmt.com/global/ko/code/409.html">
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-shangyijie"></use>
</svg>
</div>
<span>이전 섹션</span>
</a>
<a href="//m.sbmmt.com/global/ko/code/425.html">
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xiayijie"></use>
</svg>
</div>
<span>다음 섹션</span>
</a>
<a href="//m.sbmmt.com/global/ko/course.html">
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-jiahao"></use>
</svg>
</div>
<span>튜토리얼 목록</span>
</a>
<a href="//m.sbmmt.com/global/ko/wenda.html">
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-wenhao"></use>
</svg>
</div>
<span>도움을 받다</span>
</a>
</div>
</div>
<div class="videoplay_buttom">
<div>
<div class="videoplay_buttomL">
<div class="layui-tab">
<ul class="layui-tab-title">
<li class="layui-this">코스 추천</li>
<li id="studydownload">코스웨어 다운로드</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<div class="studylistmain2M">
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/10.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/6253e1723d354580.png" alt="손끝에서 HTML+CSS를 배우세요" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/10.html"><span class="level1">초등학교</span>손끝에서 HTML+CSS를 배우세요</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>37737</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="10">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/46.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/625d34b4282b2406.jpg" alt="SVG 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/46.html"><span class="level1">초등학교</span>SVG 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>13421</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="46">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/47.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/62566e3daab47144.png" alt="AngularJS 중국어 참조 매뉴얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/47.html"><span class="level1">초등학교</span>AngularJS 중국어 참조 매뉴얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>24899</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="47">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/48.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/625678786c131382.png" alt="Go 언어 튜토리얼 매뉴얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/48.html"><span class="level1">초등학교</span>Go 언어 튜토리얼 매뉴얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>27730</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="48">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/49.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/6255171d87a17356.png" alt="Redis 명령 조작 중국어 매뉴얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/49.html"><span class="level1">초등학교</span>Redis 명령 조작 중국어 매뉴얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>58200</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="49">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/50.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/62590b454b8a0476.png" alt="파이썬 3 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/50.html"><span class="level1">초등학교</span>파이썬 3 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>87889</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="50">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/51.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/62567b7a9e6b4232.png" alt="XML DOM 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/51.html"><span class="level1">초등학교</span>XML DOM 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>21303</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="51">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/52.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/62569da1dee7f988.png" alt="Memcached 명령 운영 매뉴얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/52.html"><span class="level1">초등학교</span>Memcached 명령 운영 매뉴얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>18095</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="52">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/53.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/625faffadd945342.jpg" alt="XSLT 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/53.html"><span class="level1">초등학교</span>XSLT 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>10079</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="53">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/54.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/6261193d7bfd4719.jpg" alt="XQuery 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/54.html"><span class="level1">초등학교</span>XQuery 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>9390</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="54">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/55.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/6261170629d0a718.jpg" alt="XLink 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/55.html"><span class="level1">초등학교</span>XLink 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>8828</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="55">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
<div class="studylistmain2Ms">
<span>무료</span>
<a href="//m.sbmmt.com/global/ko/course/56.html"><img src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/course/000/000/068/62610e8c90501604.jpg" alt="XPointer 튜토리얼" /></a>
<div>
<a href="//m.sbmmt.com/global/ko/course/56.html"><span class="level1">초등학교</span>XPointer 튜토리얼</a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing-"></use>
</svg>
<span>8470</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="56">
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star1.png" alt="수집" />
<img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/index2_star2.png" alt="수집" />
</a>
</div>
</div>
</div>
</div>
</div>
<div class="layui-tab-item">
<div class="studydatadown_nothing">
<img src="/static/imghw/studydatadown_nothing.png" alt="" />
현재 코스웨어를 다운로드할 수 없습니다. 현재 직원들이 정리하고 있습니다. 앞으로도 본 강좌에 많은 관심 부탁드립니다~ </div>
</div>
</div>
</div>
</div>
<div class="videoplay_buttomR">
<div class="phpmain1_2_top">
<span class="phpmain1_2_top_title">이 강좌를 시청한 학생들도 학습하고 있습니다.</span>
</div>
<div class="videoplay_buttomRM">
<div class="videoplay_buttomRM_top">
<a href="//m.sbmmt.com/global/ko/course/812.html"><img class="lazy" data-src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" src="/static/imghw/default1.png" onerror="this.onerror='';this.src='/static/imghw/default1.png'" alt="" /></a>
<div>
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-yanjing"></use>
</svg>
<span>496451</span>
</div>
<a href="javascript:;" class="courseICollection" data-id="812">
<div class="icon_f">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-star"></use>
</svg>
<svg class="icon activeicon" aria-hidden="true">
<use xlink:href="#icon-star__easyico-copy-copy"></use>
</svg>
</div>
</a>
</div>
</div>
<div class="videoplay_buttomRM_m">
<a href="//m.sbmmt.com/global/ko/course/1503.html">PHP로 사업을 시작하는 방법에 대해 간단히 이야기해 보겠습니다.</a>
<a href="//m.sbmmt.com/global/ko/course/901.html">웹 프론트 엔드 개발에 대한 빠른 소개</a>
<a href="//m.sbmmt.com/global/ko/course/836.html">민망한 물건 백과사전 사이트를 모방한 Mini 버전 MVC 프레임워크의 대규모 실용 Tianlongbabu 개발</a>
<a href="//m.sbmmt.com/global/ko/course/902.html">PHP 실용 개발 시작하기: 빠른 PHP 생성 [중소기업 포럼]</a>
<a href="//m.sbmmt.com/global/ko/course/866.html">로그인 인증 및 클래식 게시판</a>
<a href="//m.sbmmt.com/global/ko/course/1463.html">컴퓨터 네트워크 지식 수집</a>
<a href="//m.sbmmt.com/global/ko/course/1462.html">빠른 시작 Node.JS 정식 버전</a>
<a href="//m.sbmmt.com/global/ko/course/1455.html">당신을 가장 잘 이해하는 프론트엔드 강좌: HTML5/CSS3/ES6/NPM/Vue/...[원본]</a>
<a href="//m.sbmmt.com/global/ko/course/1467.html">자신만의 PHP MVC 프레임워크 작성(깊이 있는 40개 장/자세한 내용/초보자가 발전하려면 읽어야 함)</a>
</div>
</div>
</div>
</div>
</div>
</main>
<footer>
<div class="footer">
<div class="footertop">
<img class="lazy" src="/static/imghw/logo.png" alt="">
<p>공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！</p>
</div>
<div class="footermid">
<a href="//m.sbmmt.com/global/ko/about/us.html">회사 소개</a>
<a href="//m.sbmmt.com/global/ko/about/disclaimer.html">부인 성명</a>
<a href="//m.sbmmt.com/global/ko/new/">최근 업데이트</a>
<a href="//m.sbmmt.com/global/ko/new/">Sitemap</a>
</div>
<div class="footerbottom">
<p>
© php.cn All rights reserved
</p>
</div>
</div>
</footer>
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u = "https://tongji.php.cn/";
_paq.push(['setTrackerUrl', u + 'matomo.php']);
_paq.push(['setSiteId', '9']);
var d = document,
g = d.createElement('script'),
s = d.getElementsByTagName('script')[0];
g.async = true;
g.src = u + 'matomo.js';
s.parentNode.insertBefore(g, s);
})();
</script>
<!-- End Matomo Code -->
<script>
layui.use(function() {
var util = layui.util;
util.fixbar({
on: {
mouseenter: function(type) {
layer.tips(type, this, {
tips: 4,
fixed: true,
});
},
mouseleave: function(type) {
layer.closeAll("tips");
},
},
});
});
document.getElementById("lan1sp").addEventListener("click", function(event) {
event.preventDefault();
var elements = document.getElementsByClassName("m_menu");
for (var i = 0; i < elements.length; i++) {
elements[i].style.display = "block";
}
});
document.getElementById("m_editormain12main_topi_sp").addEventListener("click", function(event) {
event.preventDefault();
var elements = document.getElementsByClassName("m_menu");
for (var i = 0; i < elements.length; i++) {
elements[i].style.display = "none";
}
});
document.getElementById("lan1").addEventListener("click", function(event) {
event.preventDefault();
var elements = document.getElementsByClassName("m_menu_lang");
for (var i = 0; i < elements.length; i++) {
elements[i].style.display = "block";
}
});
document.getElementById("m_editormain12main_topi_lan").addEventListener("click", function(event) {
event.preventDefault();
var elements = document.getElementsByClassName("m_menu_lang");
for (var i = 0; i < elements.length; i++) {
elements[i].style.display = "none";
}
});
$(document).ready(function() {
$("#Submitbutton").click(function(e) {
e.preventDefault();
$(".editorplayR").addClass("active");
});
$("#editorplayR_close").click(function(e) {
e.preventDefault();
$(".editorplayR").removeClass("active");
});
});
</script>
</body>
</html><script defer src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon='{"version":"2024.11.0","token":"8c758bee214b4fe0858e454e5edf6f97","r":1,"server_timing":{"name":{"cfCacheStatus":true,"cfEdge":true,"cfExtPri":true,"cfL4":true,"cfOrigin":true,"cfSpeedBrain":true},"location_startswith":null}}' crossorigin="anonymous"></script>
<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'9bd3ae46fb584b6f',t:'MTc2ODI5NDU5MA=='};var a=document.createElement('script');a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script>
