HTML之学习笔记（一）简介 - 李锦成-html教程-PHP中文网

HTML之学习笔记（一）简介 - 李锦成

php中文网

发布： 2016-05-20 13:46:43

原创

1417人浏览过

　　html(hypertext markup language超文本标记语言)，'超文本'指的是页面不仅可以包含文本信息，还可以包含图片，链接等非文本元素。html与js,jq是共同用来进行网站前端开发的语言，符合xml规范，使用成对标签来进行编程，可以生成由浏览器可直接执行的.html或.htm后缀名的文件。
　　在网站前端开发过程中，因为浏览器的各种兼容性问题，导致显示的效果会有所偏差，所以在开发过程中常需要用不同的浏览器进行测试。一般测试的浏览器有ie,chrome,firefox,opera和safari,是根据浏览器的内核不同来划分的。

　　开发工具
　　Notepad++,Sublime,VS各版本，DW等都各具特色。

　 动态和静态的区别
只用html写出的页面为纯静态页面，和加入js效果的动态页面做区分，使用这两种构成的网站为静态网站（有服务器直接处理，直接返回给浏览器一个html页面），相对于另一种动态网站（.aspx和.ashx或.php文件，服务器无法直接处理（如http服务器），由IIS（Internet Information Server）服务器处理，并返回给浏览器）。
　　html是不区分大小写的，但规范是用小写。由成对的关闭的标签构成，代码框架为head+body，如下：

立即学习“前端免费学习笔记（深入）”；

AliGenie 天猫精灵开放平台

天猫精灵开放平台

156

查看详情

<span style="color: #008080;"> 1</span>     <span style="color: #0000ff;"><</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 2</span>         <span style="color: #0000ff;"><</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 3</span>             <span style="color: #0000ff;"><</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>显示标题<span style="color: #0000ff;"></</span><span style="color: #800000;">title</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 4</span>             <span style="color: #0000ff;"><</span><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/css"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 5</span>                 <span style="background-color: #f5f5f5; color: #000000;"><!--</span><span style="background-color: #f5f5f5; color: #000000;">添加页面控制脚本 </span><span style="background-color: #f5f5f5; color: #000000;">--></span>
<span style="color: #008080;"> 6</span>             <span style="color: #0000ff;"></</span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 7</span>             <span style="color: #0000ff;"><</span><span style="color: #800000;">script </span><span style="color: #ff0000;">type</span><span style="color: #0000ff;">="text/javascript"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;"> 8</span>                 <span style="background-color: #f5f5f5; color: #000000;"><!--</span><span style="background-color: #f5f5f5; color: #000000;">添加js脚本 </span><span style="background-color: #f5f5f5; color: #000000;">--></span>
<span style="color: #008080;"> 9</span>             <span style="color: #0000ff;"></</span><span style="color: #800000;">script</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">10</span>         <span style="color: #0000ff;"></</span><span style="color: #800000;">head</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">11</span>         <span style="color: #0000ff;"><</span><span style="color: #800000;">body </span><span style="color: #ff0000;">text</span><span style="color: #0000ff;">="green"</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">12</span> <span style="color: #000000;">            页面显示部分的代码
</span><span style="color: #008080;">13</span>         <span style="color: #0000ff;"></</span><span style="color: #800000;">body</span><span style="color: #0000ff;">></span>
<span style="color: #008080;">14</span>     <span style="color: #0000ff;"></</span><span style="color: #800000;">html</span><span style="color: #0000ff;">></span>

登录后复制

页面显示效果如下：