HTML基础知识(转)[@more@]
当我们畅游Internet时，我们透过浏览器所看到的网站，是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) 是一种建立网页文件的语言，透过标记式的指令 (Tag)，将影像、声音、图片、文字等连结显示出来。
HTML标记是由 < 和 > 所括住的指令，主要分为 : 单标记指令、双标记指令 ( 由 < 起始标记 >，< / 结束标记 >所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑，完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示，若测试没有问题则可以放到服务器 (Server) 上，对外发布信息。
HTML文件基本架构
文件开始
标头区开始
... 标题区
标头区结束
本文区开始
本文区内容
本文区结束
文件结束
网页文件格式。
标头区 : 记录文件基本资料，如作者、编写时间。
标题区 : 文件标题须使用在标头区内，可以在浏览器最上面看到标题。</P>
<P> <BODY> 本文区 : 文件资料，即在浏览器上看到的网站内容。</P>
<P> 注意事项</P>
<P> 通常一份HTML网页文件包含二个部份 : <HEAD>...</HEAD> 标头区、 <BODY>...</BODY> 本文区。而 <HTML> 和 </HTML> 代表网页文件格式。</P>
<P> 习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站，浏览器便会自动的找出 index.htm 文件。</P>
<P></P><BR>
</div>
<p style="clear:both;"></p>
<p class="translate">
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/10752019/viewspace-950120/
，如需转载，请注明出处，否则将追究法律责任。
</p>
<!--
-->
</div>
</div>
<div class="preview-footer clearfix">
<!--已点赞、收藏-->
<div class="icon-praise" id="praise" onclick="blogObj.praise($(this),'/praise/')"><span
class="text"></span><span class="num">0</span></div>
<div class="icon-collect" id="collect" onclick="blogObj.praise($(this),'/favour/')"><span
class="text"></span><span class="num">0</span></div>
<div class="share-group fr">
<div class="bdsharebuttonbox bdshare-button-style0-16" data-bd-bind="1522216707615">
<span class="fl">分享到：</span>
<a href="javascript:;" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
<a href="javascript:;" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
<a href="javascript:;" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
<a href="javascript:;" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
</div>
<script>
window._bd_share_config = {
"common": {
"bdSnsKey": {},
"bdText": "",
"bdDesc": "",
"bdMini": "",
"bdMiniList": false,
"bdPic": "",
"bdStyle": "0",
"bdSize": "32"
}, "share": {"bdSize": 16}
};
with (document)
0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = '/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];
if ($(window).width() < 1320) {
if ($(window).width() < 1200) {
$(".sideslip").css({
"left": "20px",
"margin-left": 0
})
} else {
$(".sideslip").css({
"margin-left": "-590px"
})
}
}</script>
</div>
</div>
<div class="article-context">
<div class="fl">
<span class="color77">上一篇：</span>
<a href="https://blog.itpub.net/10752019/viewspace-950117/">学习HTML教程(转)</a>
</div>
<div class="fr">
<span class="color77">下一篇：</span>
<a href="https://blog.itpub.net/10752019/viewspace-950122/">由显示/隐藏引出的CSS Bug(转)</a>
</div>
</div>
<input type="hidden" id="blogId" name="blogId" value="950120">
<!--评论开始-->
<div class="blog-comment">
<div class="new-comment">
<input type="hidden" id="hid" name="hid" value="950120">
<input type="hidden" name="_token" value="oX3b65xaHvNSoCHLPzv2V0kGrqSUEy6jTxcRPiZE">
<a class="avatar" href="javascript:;">
<img src="/images/user_pic_default.png"></a>
<!--用户未登录-->
<div class="sign-container">
<span>请登录后发表评论</span>
<a class="btn btn-sign">
<a class="layui-btn ml30" onclick="blog.login(event)">登录</a>
</a>
</div>
<!--用户已登录-->
<textarea placeholder="请写下你的评论…" onfocus="blogObj.textareaFocus($(this),200)"
maxlength=200></textarea>
</div>
<div class="comment-list">
<div class="top-title"><span class="all-comment">全部评论</span> <span
class="colorbb ml20"></span>
</div>
<div class="comment-items" id="comment_items">
<script type="text/template" id='blog_template'>
<%for(var i=0;i
<items.length;i++){%>
<div class="comment-item">
<div class="author">
<a target="_blank" href="/<%=items[i].uid%>" class="avatar">
<img src="<%=items[i].headimg%>" alt="">
</a>
<div class="info">
<div class="name"><a target="_blank" href="/<%=items[i].uid%>"><%=items[i].username%></a>
<span class="fr reply-btn"
onclick="blogObj.newComment($(this),'<%=items[i].username%>',<%=items[i].id%>)">回复</span>
</div>
<div class="time colorbb"><%=items[i].createtime%></div>
</div>
</div>
<p class="comment-wrap"><%=items[i].content%></p>
<%if(items[i].items.items.length) { %>
<div class="sub-comment-list">
<%for(var j=0;j
<items
[i].items.items.length;j++){%>
<div class="sub-comment">
<div class="color77 time-reply">
<span class="time"><%=items[i].items.items[j].createtime%></span>
<span class="reply-btn fr"
onclick="blogObj.newComment($(this),'<%=items[i].items.items[j].username%>',<%=items[i].items.items[j].id%>)">回复</span>
</div>
<p><a href="/<%=items[i].uid%>"><%=items[i].items.items[j].username%></a> 回复 <a
href="/<%=items[i].touid%>"><%=items[i].items.items[j].tousername%></a>：
<span class="content"><%=items[i].items.items[j].content%></span></p>
</div>
<%}%>
<%if(items[i].items.total > 5) { %>
<div class="more-comment"><span class="sub-comment-count">还有<i class="count"><%=items[i].items.total-5%></i>条评论</span><span
class="more-comment-btn"
onclick=blogObj.loadSubComment($(this),<%=items[i].id%>) data-count=1 data-flag=true>点击查看</span>
</div>
<%}%>
</div>
<%}%>
</div>
<%}%>
</script>
</div>
</div>
</div>
<!--评论结束-->
</div>
<script>
</script>
<div class="fr w290">
<!--作者信息开始-->
<!--作者信息开始-->
<div class="author-info right-fixed ">
<div class="head-img">
<a href="https://blog.itpub.net/10752019/"><img src="http://account.itpub.net/api/avatar.php?uid=10752019" alt=""></a>
</div>
<div class="author-name"><a href="https://blog.itpub.net/10752019/">amyz</a></div>
<div class="author-intro">
</div>
<ul class="tree-list clearfix">
<li>
<div class="item-tt">博文量</div>
<a href="https://blog.itpub.net/10752019/"><span class="item-num blognum">3982</span></a>
</li>
<li>
<div class="item-tt">访问量</div>
<div class="item-num blogviewnum">7894334</div>
</li>
</ul>
</div>
<!--作者信息结束-->
<script>
var data = {uid: 10752019};
$._ajax({
url: '/getAuthorInfo/',
data: data,
type: 'get',
dataType: 'json',
success: function (data) {
if (data.code == 200) {
var data = data.data;
$(".blognum").text(data.blognum);
$(".blogviewnum").text(data.visitednum);
}
}
});
</script> <!--作者信息结束-->
<!--博文推荐开始-->
<div class="blog-choice right-fixed">
<h3 class="choice-title">最新文章</h3>
<ul class="newul">
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-1001318/"
class="clearfix">
防止关闭windows (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-1001315/"
class="clearfix">
TList，AnsiString和DynamicArray的妙用 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-1001311/"
class="clearfix">
在OpenGL中使用各异向性纹理过滤 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-1001310/"
class="clearfix">
完成端口(上) (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-987000/"
class="clearfix">
WebLogic的初步研究（2）－－结构篇 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-986998/"
class="clearfix">
玩转Windows桌面图标 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-986997/"
class="clearfix">
Dos下键盘的完全控制 ------- 一系列的BIOS级别的键盘控制函数！ (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-986996/"
class="clearfix">
图像平滑滚动效果的VC实现 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-986995/"
class="clearfix">
VC++初学者常见问题解惑 (转)
</a>
</li>
<li class="new-item">
<a href="https://blog.itpub.net/10752019/viewspace-986993/"
class="clearfix">
例程详析动态链接库 (转)
</a>
</li>
<ul>
</div>
<!--大牛精选结束-->
</div>
</div>
<div class="icon-back-top" onclick="$('html,body').animate({scrollTop:0},'slow');"></div>
<!--main部分结束-->
<!--百度推送-->
<script>
(function () {
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
} else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
<!--footer部分开始-->
<div class="blog-footer">
<div class="w1200 pr">
<div class="footer-links">
<a class="icon-blog icon-wx mr30">
<div class="wx-qrcode">
<img src="/images/qrcode.jpg" alt="">
</div>
</a>
<a href="https://weibo.com/itpub2001?from=myfollow_all" class="icon-blog icon-wb" target="_blank"></a>
</div>
<p class="footer-nav">
<a href="http://www.it168.com/bottomfile/it168.shtml" target="_blank">支持我们</a>
<a href="http://www.it168.com/bottomfile/tgzn.shtml" target="_blank">作者招募</a>
<a href="http://www.it168.com/bottomfile/sytk.shtml" target="_blank">用户协议</a>
<a href="//blog.itpub.net/31509949/viewspace-2157750/" target="_blank">FAQ</a>
<a href="http://edu.itpub.net/contactus.html" target="_blank">Contact Us</a>
<script src="https://s22.cnzz.com/z_stat.php?id=1274521965&web_id=1274521965" language="JavaScript"></script>
<a target="_blank" href="https://www.itpub.net/editorial-standards.html" rel="nofollow">编辑准则</a>
</p>
<p>北京盛拓优讯信息技术有限公司. 版权所有 <a style="color:#777777;" target="_blank" href="http://beian.miit.gov.cn">京ICP备16024965号-8</a> 北京市公安局海淀分局网监中心备案编号：11010802021510 niuxiaotong@pcpop.com 17352615567
<a style="color:#777777;" target="_blank" href="http://www.it168.com/jubao.html"> 未成年人举报专区</a></p>
<p>广播电视节目制作经营许可证(京) 字第1234号 中国互联网协会会员</p>
<p>违法和不良信息举报电话:18101376593</p>
</div>
</div>
<!--footer部分结束-->
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?5016281862f595e78ffa42f085ea0f49";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?540bee2c1a1b922df9e0a0b922440b73";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<!-- END STAT PV -->
</body>
</html>