>  기사  >  웹 프론트엔드  >  xml html xhtml html5

xml html xhtml html5

WBOY
WBOY원래의
2016-09-15 11:15:141160검색

1. XML

XML이란 무엇인가요?

  • XML은 Extensible Markup Language(EXtensible Markup Language)를 의미합니다
  • XML은 HTML과 매우 유사한 마크업 언어입니다
  • XML은 데이터를 표시하는 것이 아니라 데이터를 전송하도록 설계되었습니다
  • XML 태그는 사전 정의되지 않습니다. 라벨을 직접 정의해야 합니다.
  • XML은 자기 설명이 가능하도록 설계되었습니다.
  • XML은 W3C에서 권장하는 표준입니다

XML과 HTML의 주요 차이점

XML은 HTML을 대체하지 않습니다.

XML과 HTML은 서로 다른 목적으로 설계되었습니다.

XML은 데이터의 콘텐츠에 중점을 두고 데이터를 전송하고 저장하도록 설계되었습니다.

HTML은 데이터의 모양에 중점을 두고 데이터를 표시하도록 설계되었습니다.

HTML은 정보를 표시하도록 설계되었으며 XML은 정보를 전송하도록 설계되었습니다.

어떤 동작도 없는 XML

XML은 아무 작업도 수행하지 않습니다.

아마 이해하기 조금 어려울 수도 있지만 XML은 아무 것도 하지 않습니다. XML은 정보를 구조화, 저장 및 전송하도록 설계되었습니다.

다음은 XML로 저장된 John이 George에게 보낸 메모입니다.

<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget the meeting!</body>
</note>

위의 메모는 자기 설명적입니다. 제목과 메시지가 있고 보낸 사람과 받는 사람 모두에 대한 정보가 포함되어 있습니다.

그러나 이 XML 문서는 여전히 아무 작업도 수행하지 않습니다. 이는 단지 XML 태그로 싸인 순수한 정보일 뿐입니다. 우리는 이 문서를 전송, 수신, 표시하기 위한 소프트웨어나 프로그램을 작성해야 합니다.

XML은 단순한 텍스트입니다

XML은 특별한 것이 아닙니다. 그냥 평범한 텍스트일 뿐입니다. 일반 텍스트를 처리할 수 있는 모든 소프트웨어는 XML을 처리할 수 있습니다.

그러나 XML을 이해하는 애플리케이션은 XML 태그를 원하는 방식으로 처리할 수 있습니다. 라벨의 기능적 의미는 애플리케이션의 특성에 따라 다릅니다.

XML을 사용하면 자신만의 태그를 만들 수 있습니다

위 예의 태그는 XML 표준(예: )으로 정의되지 않았습니다. 이 태그는 문서 작성자가 발명한 것입니다.

XML에는 미리 정의된 태그가 없기 때문입니다.

HTML에 사용되는 태그(따라서 HTML의 구조)는 미리 정의되어 있습니다. HTML 문서는 HTML 표준에 정의된 태그(예:

,

등)만 사용합니다.

XML을 사용하면 작성자가 자신의 태그와 문서 구조를 정의할 수 있습니다.

XML은 HTML을 대체하지 않습니다

XML은 HTML을 보완합니다.

XML이 HTML을 대체하지 않는다는 점을 이해하는 것이 중요합니다. 대부분의 웹 애플리케이션에서 XML은 데이터를 전송하는 데 사용되는 반면 HTML은 데이터 형식을 지정하고 표시하는 데 사용됩니다.

XML에 대한 가장 좋은 설명은 다음과 같습니다.

XML은 소프트웨어, 하드웨어로부터 독립된 정보 전달 도구입니다.

XML은 W3C에서 권장하는 표준입니다

XML(Extensible Markup Language)은 1998년 2월 10일에 W3C 권장 사항이 되었습니다.

W3C XML 활동에 대한 자세한 내용을 보려면 W3C 튜토리얼을 방문하세요.

XML은 어디에나 있습니다

XML 표준의 급속한 발전 과정과 많은 소프트웨어 개발자들이 이 표준을 채택하는 빠른 속도를 볼 때 우리는 한숨을 쉬지 않을 수 없습니다.

현재 XML은 항상 웹의 초석이었던 HTML만큼 웹에서 중요한 역할을 하고 있습니다.

XML은 어디에나 있습니다. XML은 다양한 응용 프로그램 간의 데이터 전송에 가장 일반적으로 사용되는 도구이며 정보 저장 및 설명 분야에서 점점 더 대중화되고 있습니다.

2. HTML

HTML이란 무엇인가요?

HTML은 웹페이지를 설명하는 데 사용되는 언어입니다.

  • HTML은 하이퍼텍스트 마크업 언어(Hyper Text Markup Language)
  • 를 나타냅니다.
  • HTML은 프로그래밍 언어가 아니라 마크업 언어(markup Language)입니다
  • 마크업 언어는 마크업 태그의 집합입니다.
  • HTML은 마크업 태그를 사용하여 웹 페이지를 설명합니다

HTML 태그

HTML 태그를 HTML 태그라고도 합니다.

  • HTML 태그는
  • 과 같이 꺾쇠 괄호로 묶인 키워드입니다.
  • HTML 태그는 일반적으로 와 같이 쌍으로 나타납니다.
  • 태그 쌍의 첫 번째 태그는 여는 태그이고 두 번째 태그는 닫는 태그입니다
  • 열기 태그와 닫는 태그는 열기 태그, 닫기 태그라고도 합니다

 

HTML 文档 = 网页

  • HTML 文档描述网页
  • HTML 文档包含 HTML 标签和纯文本
  • HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容:

<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

例子解释

  • 与 之间的文本描述网页
  • 与 之间的文本是可见的页面内容
  • 之间的文本被显示为标题
  • 之间的文本被显示为段落

3、XHTML

 

 

什么是 XHTML?

 

  • XHTML 指的是可扩展超文本标记语言
  • XHTML 与 HTML 4.01 几乎是相同的
  • XHTML 是更严格更纯净的 HTML 版本
  • XHTML 是以 XML 应用的方式定义的 HTML
  • XHTML 是 2001 年 1 月发布的 W3C 推荐标准
  • XHTML 得到所有主流浏览器的支持

 

为什么使用 XHTML?

因特网上的很多页面包含了“糟糕”的 HTML。

如果在浏览器中查看,下面的 HTML 代码运行起来非常正常(即使它并未遵守 HTML 规则):

<html>
<head>
<title>This is bad HTML</title>
<body>
<h1>Bad HTML
<p>This is a paragraph
</body>

XML 是一种必须正确标记且格式良好的标记语言。

如果希望学习 XML,请阅读我们的 XML 教程。

今日的科技界存在一些不同的浏览器技术。其中一些在计算机上运行,而另一些可能在移动电话或其他小型设备上运行。小型设备往往缺乏解释“糟糕”的标记语言的资源和能力。

所以 - 通过结合 XML 和 HTML 的长处,开发出了 XHTML。XHTML 是作为 XML 被重新设计的 HTML。

与 HTML 相比最重要的区别:

文档结构

  • XHTML DOCTYPE 是强制性的
  • 中的 XML namespace 属性是强制性的
  • 、、 以及 <body> 也是强制性的</li> </ul> <h3>元素语法</h3> <ul> <li>XHTML 元素必须正确嵌套</li> <li>XHTML 元素必须始终关闭</li> <li>XHTML 元素必须小写</li> <li>XHTML 文档必须有一个根元素</li> </ul> <h3>属性语法</h3> <ul> <li>XHTML 属性必须使用小写</li> <li>XHTML 属性值必须用引号包围</li> <li>XHTML 属性最小化也是禁止的</li> </ul> </div> <p> </p> <div> <h2><!DOCTYPE ....> 是强制性的</h2> <p>XHTML 文档必须进行 XHTML 文档类型声明(XHTML DOCTYPE declaration)。</p> <p>您可以在 W3School 的标签参考手册中找到完整的 XHTML 文档类型。</p> <p><html>、<head>、<title> 以及 <body> 元素也必须存在,并且必须使用 <html> 中的 xmlns 属性为文档规定 xml 命名空间。</p> <p>下面的例子展示了带有最少的必需标签的 XHTML 文档:</p> <pre class="brush:php;toolbar:false"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Title of document</title> </head> <body> ...... </body> </html> </pre> </div> <p> </p> <div> <h2>如何从 HTML 转换到 XHTML</h2> <ol> <li>向每张页面的第一行添加 XHTML <!DOCTYPE></li> <li>向每张页面的 html 元素添加 xmlns 属性</li> <li>把所有元素名改为小写</li> <li>关闭所有空元素</li> <li>把所有属性名改为小写</li> <li>为所有属性值加引号</li> </ol> </div> <p> </p> <div> <h2>用 W3C 验证器检验 XHTML</h2> <p>在下面的文本框中输入您的网址:</p> <form action="http://validator.w3.org/check" method="get" target="_blank"> <p><input type="text" name="uri" value="http://www.w3school.com.cn/html/index.asp" size="60"></p> <p> </p> <p><span style="font-size: 18px; background-color: #ffcc00;"><strong>4、HTML5</strong></span></p> <p> </p> <h2>什么是 HTML5?</h2> <p>HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。</p> <p>HTML 的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。</p> <p>HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。</p> <div> <h2>HTML5 是如何起步的?</h2> <p>HTML5 是 W3C 与 WHATWG 合作的结果。</p> <p class="note">编者注:W3C 指 World Wide Web Consortium,万维网联盟。</p> <p class="note">编者注:WHATWG 指 Web Hypertext Application Technology Working Group。</p> <p>WHATWG 致力于 web 表单和应用程序,而 W3C 专注于 XHTML 2.0。在 2006 年,双方决定进行合作,来创建一个新版本的 HTML。</p> <p>为 HTML5 建立的一些规则:</p> <ul> <li>新特性应该基于 HTML、CSS、DOM 以及 JavaScript。</li> <li>减少对外部插件的需求(比如 Flash)</li> <li>更优秀的错误处理</li> <li>更多取代脚本的标记</li> <li>HTML5 应该独立于设备</li> <li>开发进程应对公众透明</li> </ul> </div> <div> <h2>新特性</h2> <p>HTML5 中的一些有趣的新特性:</p> <ul> <li>用于绘画的 canvas 元素</li> <li>用于媒介回放的 video 和 audio 元素</li> <li>对本地离线存储的更好的支持</li> <li>新的特殊内容元素,比如 article、footer、header、nav、section</li> <li>新的表单控件,比如 calendar、date、time、email、url、search</li> </ul> </div> </form> </div> <pre class="brush:php;toolbar:false"><!DOCTYPE HTML> <html> <body> <video width="320" height="240" controls="controls"> <source src="movie.ogg" type="video/ogg"> <source src="movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video> </body> </html></pre> </div> <div id="MySignature"></div> <div class="clear"></div> </div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>성명:</span><div>본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.</div></div></div><div class="nphpSytBox"><span>이전 기사:<a class="dBlack" title="CSS3 선택자 연구" href="http://m.php.cn/ko/faq/335473.html">CSS3 선택자 연구</a></span><span>다음 기사:<a class="dBlack" title="CSS3 선택자 연구" href="http://m.php.cn/ko/faq/335475.html">CSS3 선택자 연구</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>관련 기사</h2><em><a href="http://m.php.cn/ko/article.html" class="bBlack"><i>더보기</i><b></b></a></em><div class="clear"></div></div><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/ko/faq/348757.html" title="HTML 지식 요약" class="aBlack">HTML 지식 요약</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ko/faq/348804.html" title="HTML을 빨리 배우는 방법" class="aBlack">HTML을 빨리 배우는 방법</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ko/faq/348873.html" title="html xhtml xml의 차이점" class="aBlack">html xhtml xml의 차이점</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ko/faq/348884.html" title="src와 href 속성의 차이점" class="aBlack">src와 href 속성의 차이점</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ko/faq/348902.html" title="HTML5 및 CSS 대체 사용 정보" class="aBlack">HTML5 및 CSS 대체 사용 정보</a><div class="clear"></div></li></ul></div></div><div class="nphpFoot"><div class="nphpFootBg"><ul class="nphpFootMenu"><li><a href="http://m.php.cn/ko/"><b class="icon1"></b><p>집</p></a></li><li><a href="http://m.php.cn/ko/course.html"><b class="icon2"></b><p>강의</p></a></li><li><a href="http://m.php.cn/ko/wenda.html"><b class="icon4"></b><p>Q&A</p></a></li><li><a href="http://m.php.cn/ko/login"><b class="icon5"></b><p>나의</p></a></li><div class="clear"></div></ul></div></div><div class="nphpYouBox" style="display: none;"><div class="nphpYouBg"><div class="nphpYouTitle"><span onclick="$('.nphpYouBox').hide()"></span><a href="http://m.php.cn/ko/"></a><div class="clear"></div></div><ul class="nphpYouList"><li><a href="http://m.php.cn/ko/"><b class="icon1"></b><span>집</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/course.html"><b class="icon2"></b><span>강의</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/article.html"><b class="icon3"></b><span>기사</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/wenda.html"><b class="icon4"></b><span>Q&A</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/dic.html"><b class="icon6"></b><span>사전</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/course/type/99.html"><b class="icon7"></b><span>수동</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/xiazai/"><b class="icon8"></b><span>다운로드</span><div class="clear"></div></a></li><li><a href="http://m.php.cn/ko/faq/zt" title="주제"><b class="icon12"></b><span>주제</span><div class="clear"></div></a></li><div class="clear"></div></ul></div></div><div class="nphpDing" style="display: none;"><div class="nphpDinglogo"><a href="http://m.php.cn/ko/"></a></div><div class="nphpNavIn1"><div class="swiper-container nphpNavSwiper1"><div class="swiper-wrapper"><div class="swiper-slide"><a href="http://m.php.cn/ko/" >집</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/article.html" class="hover">기사</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/wenda.html" >Q&A</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/course.html" >강의</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/faq/zt" >주제</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/xiazai" >다운로드</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/game" >게임</a></div><div class="swiper-slide"><a href="http://m.php.cn/ko/dic.html" >사전</a></div><div class="clear"></div></div></div><div class="langadivs" ><a href="javascript:;" class="bg4 bglanguage"></a><div class="langadiv" ><a onclick="javascript:setlang('zh-cn');" class="language course-right-orders chooselan " href="javascript:;"><span>简体中文</span><span>(ZH-CN)</span></a><a onclick="javascript:setlang('en');" class="language course-right-orders chooselan " href="javascript:;"><span>English</span><span>(EN)</span></a><a onclick="javascript:setlang('zh-tw');" class="language course-right-orders chooselan " href="javascript:;"><span>繁体中文</span><span>(ZH-TW)</span></a><a onclick="javascript:setlang('ja');" class="language course-right-orders chooselan " href="javascript:;"><span>日本語</span><span>(JA)</span></a><a onclick="javascript:;" class="language course-right-orders chooselan chooselanguage" href="javascript:;"><span>한국어</span><span>(KO)</span></a><a onclick="javascript:setlang('ms');" class="language course-right-orders chooselan " href="javascript:;"><span>Melayu</span><span>(MS)</span></a><a onclick="javascript:setlang('fr');" class="language course-right-orders chooselan " href="javascript:;"><span>Français</span><span>(FR)</span></a><a onclick="javascript:setlang('de');" class="language course-right-orders chooselan " href="javascript:;"><span>Deutsch</span><span>(DE)</span></a></div></div><script> var swiper = new Swiper('.nphpNavSwiper1', { slidesPerView : 'auto', observer: true,//修改swiper自己或子元素时,自动初始化swiper observeParents: true,//修改swiper的父元素时,自动初始化swiper }); </script></div></div><!--顶部导航 end--><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>