一、 網頁HTML的文件基本結構
網頁名稱或抬頭 網頁內容…….
二、 標示語法
HTML元素語法，主要有三種型態：
1. ＜標籤名稱 屬性名稱＝屬性值＞ 資料內容 ＜/標籤名稱＞ 2. ＜標籤名稱 屬性名稱＝屬性值＞ 資料內容 3. 資料內容＜標籤名稱 屬性名稱＝屬性值＞
三、 檔頭標籤
檔頭標籤最主要有下列幾種：
標籤：是整個文件最主要的起始標籤，可以框出整個文件的範圍。
標籤：是文件顯示文件開頭的標籤。
標籤：是文件標題欄的名稱置放位置。 <!-- -- >：註解說明 </p><p><META>：設定文件的附加資訊。如charset=”big5”表示網頁內容編碼。 http-equiv=”content-type”和content=”text/html”表示網頁的內容格式。 < BGSOUND SRC = ”音樂檔的路徑和檔名” LOOP = “PlayTimes” >標籤：背景音樂 </p><p>src = 是指檔案來源。 loop = 是指播放的數次 </p><p>PlayTimes 是指播放的數次。-1表示連續播放不停 </p><p>四、 文件內容標籤 </p><p><BODY>：是文件本體的標籤，可以宣告文件內容背景顏色等等。 </p><p>屬性：BACKGROUND = “背景檔案的路徑和名稱”：圖案背景。 </p><p> BGCOLOR =” #RRGGBB”：顏色背景。 TEXT =” #RRGGBB”： 前景設定文字顏色 </p><p>LINK = “#RRGGB”：未鏈結文字顏色設定型態。 VLINK = “#RRGGBB”：己鏈結文字顏色設定型態。 </p><p>RR→紅色，GG→綠色，BB→藍色，值是00~FF。 </p><p> </p><p>< P >資料< /P >：一般段落。可利用屬性 align=”center | right | left”設定文件對齊方式。 </p><p> </p><p>< PRE >資料< / PRE >：保留文字編排效果段落。 </p><p> < BR >：換行。屬性: CLEAR 消除段落字，在圖片和文字的頁面上，可產生文繞框。 </p><p> <CENTER>：置中標籤，讓網頁文件置中對齊。 </p><p> 特殊符號 符號標籤 < > " × </p><p> </p><p> </p><p>顯示效果 空一格 < > “ x 符號標籤 ÷ ± © ® & 顯示效果 ( ( ( ( & 五、 文字格式標籤 </p><p><small>：文字大小縮小一級。 </p><p><big>：文字大小放大一級。 </p><p>< H1 > ~ < H6 >標題字字體的大小<h1>最大<h6>最小。即是H1>H2>H3>H4>H5>H6。 </p><p>< FONT >：字型標籤。可調整文字的字型、大小及顏色。 Face=”標楷體”。 </p><p> Size=”value”：value=1~7,+2,-1。 Color=”blue”或”#RRGGBB”值。 </p><p>樣式呈現設定 文字標籤 < B > < I > < U > < SUP > < SUB > <EM> <KBD> <STRIKE> </p><p>顯示效果 柤體字 斜體字 底線字 上標字 下標字 重要文字（斜體） 較小加粗 加橫線 文字標籤 <STRONG> <VAR> <CODE> <BLOCKQUOTE> <CITE> <DFN> 顯示效果 重要文字（粗體） 顯示變數 顯示程式碼 文字內縮 參考文獻（斜體） 顯示地址（斜體） 顯示科學定律文字 六、 水平線 </p><p>< HR >：插入分隔線 </p><p>屬性： </p><p> WIDTH = “value”：為線段的長度 SIZE= “value”：為線段的厚度 </p><p> COLOR= ”blue”或”#RRGGBB”值。：為顏色 ALIGN=”right | left | center”：為線段的位置 </p><p>NOSHADE：為無陰影的實心線段 </p><p> </p><p>七、 電子看板：跑馬燈 </p><p>< MARQUEE > … … … < /MARQUEE > </p><p> 屬性： </p><p>LOOP=”value”：設定跑遍 </p><p>DIRECTION=”right | left”：文字移動方向 </p><p>SCROLLDELLAY==”value”：延遲時間（千分之一秒為單位） SCROLLAMOUNT==”value”：速度（PIXEL為單位） BEHAVIOR=”scroll | slide | alternate”：設定跑馬燈的行為模式。 WIDTH=”value”： 設定跑馬燈的寬度 HEIGHT=”value”： 設定跑馬燈的高度 </p><p>BGCOLOR= ”blue”或”#RRGGBB”值。設定跑馬燈的顏色 </p><p>八、 項目編號 </p><p>有序項目 < OL 屬性 > </p><p> < LI > 第一項 < LI > 第二項 < LI > 第三項 < /OL > </p><p>屬性：TYPE = “1| A| a| I|i”：格式 </p><p>START =”value”：啟始值 </p><p>無序項目 < UL屬性 > </p><p> < LI > 第一項 < LI > 第二項 < LI > 第三項 < /UL > </p><p> 屬性：TYPE =” DISC | CIRCLE | SQUARE” DISC：實心小圓點，為預設值 CIRCLE：虛心方塊 </p><p> SQUARE：實心方塊 </p><p>字彙項目 < DL > </p><p> < DT > 第一項 < DD > 敘述第一項的定義 </p><p> < DT > 第二項 < DD > 敘述第二項的定義 < DT > 第三項 < DD > 敘述第三項的定義 < /DL > </p><p> <DL>定義格式 專有名詞格式 專有名詞解釋格式 </p><p>九、 插入圖片 </p><p>< IMG>：圖片標籤 屬性： </p><p>SRC=”URL” ：圖片的儲放位置 </p><p>ALIGN =” left | right | center | bottom | top | middle | texttop | baseline”：對齊方式 </p><p>top圖形頂端位置和文字基線對齊 </p><p> middle 圖形中間位置和文字基線對齊 bottom圖形底端位置和文字基線對齊 texttop圖形頂端位置和文字最高位置對齊 baseline圖形底端位置和文字基線對齊 </p><p>ALT=”文字敘述”：是在圖片未顯示前的說明圖片內容。 WIDTH =”value”：是設定圖形的寬度 HEIGHT =”value”：是設定圖形的高度 HSPACE = =”value”： 是設定圖形的左右距離 VSPACE = =”value”：是設定圖形的上下距離 </p><p>BORDER=”value”：外框厚度 </p><p> LOWSRC = “圖形位置” 支援低解析度圖片先顯示，後原圖。 STYLE=”position：absolute；top：60；left：90；color：red；…” Position是位置有absolute 和 relative兩種 Top是上下位置 Left是左右位置 Color是指顏色 </p><p> 濾鏡（filter）、換頁效果（transition）和顯示 （visibility）等。 </p><p></p>
<br />
<p><script type="text/javascript">s("content-m");</script></p>
</div>
<div class="m-pages"></div>
<div class="down-word">
<div class="word-ico"></div>
<div class="word-tit">
<span class="docx">网页HTML的文件基本结构.doc</span>
<span>将本文的Word文档下载到电脑</span>
<span>下载失败或者文档不完整，请联系客服人员解决！ </span>
</div>
<div class="word-pic"><a href="javascript:;">下载这篇word文档</a></div>
</div>
</article>
<div class="art-prenext">
<p>下一篇：<a href="/wenku/jiaoyu/1049950.html">体育理论题库（体育舞蹈） - 图文</a></p>
</div>
<script type="text/javascript">s("like-m");</script>
<div class="main-tab"><a class="on" href="javascript:;">相关阅读</a></div>
<div class="tab-box">
<ul class="main-new on clearfix">
<li><a href="/wenku/jiaoyu/1151876.html" title="中国石油大学(北京)远程在线考试答案—《油气">中国石油大学(北京)远程在线考试答案—《油气</a></li>
<li><a href="/wenku/jiaoyu/1229519.html" title="中国移动网上大学传输设备PTN烽火L2题库">中国移动网上大学传输设备PTN烽火L2题库</a></li>
<li><a href="/wenku/jiaoyu/1287270.html" title="苏教版三年级数学下册口算练习题竖式精选（两">苏教版三年级数学下册口算练习题竖式精选（两</a></li>
<li><a href="/wenku/jiaoyu/1230553.html" title="2021年高考全国乙卷文科数学试题答案">2021年高考全国乙卷文科数学试题答案</a></li>
<li><a href="/wenku/jiaoyu/1150887.html" title="2019年江苏五年制专转本英语统考真题">2019年江苏五年制专转本英语统考真题</a></li>
<li><a href="/wenku/jiaoyu/938557.html" title="《统计学》复习题(3)">《统计学》复习题(3)</a></li>
<li><a href="/wenku/jiaoyu/1131506.html" title="大型集团党建制度（包括三会一课、党员学习、">大型集团党建制度（包括三会一课、党员学习、</a></li>
<li><a href="/wenku/jiaoyu/1053491.html" title="干燥机，润磨机设备操作维护规程">干燥机，润磨机设备操作维护规程</a></li>
<li><a href="/wenku/jiaoyu/1144707.html" title="2006年中国药科大学有机化学考研专业课真题及">2006年中国药科大学有机化学考研专业课真题及</a></li>
<li><a href="/wenku/jiaoyu/688148.html" title="夏季减肥打造小蛮腰">夏季减肥打造小蛮腰</a></li>
</ul>
</div>
<div class="main-tab"><a class="on" href="javascript:;">本类排行</a></div>
<div class="tab-box">
<ul class="main-new on clearfix">
<li><a href="/wenku/jiaoyu/1287711.html" title="2022最新数学教师工作总结方案多篇">2022最新数学教师工作总结方案多篇</a></li>
<li><a href="/wenku/jiaoyu/1230558.html" title=" 2021高考全国甲卷文科数学试题及答案"> 2021高考全国甲卷文科数学试题及答案</a></li>
<li><a href="/wenku/jiaoyu/1151861.html" title="中国石油大学(北京)远程在线考试答案—《安全">中国石油大学(北京)远程在线考试答案—《安全</a></li>
<li><a href="/wenku/jiaoyu/1151866.html" title="石油大学《化工过程设备设计》主观题（单数）">石油大学《化工过程设备设计》主观题（单数）</a></li>
<li><a href="/wenku/jiaoyu/1151863.html" title="中国石油大学(北京)远程在线考试答案—《催化">中国石油大学(北京)远程在线考试答案—《催化</a></li>
<li><a href="/wenku/jiaoyu/1092360.html" title="石油大学远程在线考试《机械制造基础》试题答">石油大学远程在线考试《机械制造基础》试题答</a></li>
<li><a href="/wenku/jiaoyu/666323.html" title="广西路网项目公路工程文件材料收集立卷归档实">广西路网项目公路工程文件材料收集立卷归档实</a></li>
<li><a href="/wenku/jiaoyu/718492.html" title="六年级汉语拼音总复习题（新星小学）">六年级汉语拼音总复习题（新星小学）</a></li>
<li><a href="/wenku/jiaoyu/1278950.html" title="最新苏教版三年级数学上册《间隔排列》易错题">最新苏教版三年级数学上册《间隔排列》易错题</a></li>
<li><a href="/wenku/jiaoyu/1271665.html" title="部编版三年级语文上册基础知识练习（2021期末">部编版三年级语文上册基础知识练习（2021期末</a></li>
</ul>
</div>
</div>
<footer class="footer">
<p class="bt-links"><a href="https://m.77cn.com.cn">手机版</a><span class="v-line">|</span><a href="https://www.77cn.com.cn">PC版</a><span class="v-line">|</span><a href="https://m.77cn.com.cn/fww">范文大全</a></p>
<p>Copyright © 2019-2022 免费范文网 版权所有<br/>
声明 :本网站尊重并保护知识产权，根据《信息网络传播权保护条例》，如果我们转载的作品侵犯了您的权利,请在一个月内通知我们，我们会及时删除。<br/>客服QQ： 邮箱：tiandhx2@hotmail.com<br/>
<a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">苏ICP备16052595号-18</a>
</p>
<div style="display:none;">
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?6e245478384fea490ec3a2317ee103ab";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<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>
</div>
</footer>
<div class="theme-popover">
<div class="theme-poptit">
<a href="javascript:;" title="关闭" class="close">×</a>
<b>注册会员免费下载</b>（下载后可以自由复制和排版）
</div>
<div class="theme-popbod dform">
<!--<p class="downtit">下载本文档需要支付 <i>7</i> 元</p>-->
<!--<p class="chose"><span>支付方式：</span><span class="pay1"><img src="https://www.77cn.com.cn/img/wxpay.jpg" class="over"></span> <span class="pay2"><img src="https://www.77cn.com.cn/img/alipay.jpg"></span></p>-->
<!--<div class="youke_pay">-->
<!--<div class="wxpay"><a href="javascript:;">微信支付并下载</a></div>-->
<!--<div class="alipay" style="display:none;"><a href="javascript:;">支付宝支付并下载</a>-->
<!--</div>-->
<!--</div>-->
<p class='wxpay'><a href='https://www.77cn.com.cn/user/index.php'>马上注册会员</a></p>
<p class="downtxt">注：下载文档有可能“只有目录或者内容不全”等情况，请下载之前注意辨别，如果您已付费且无法下载或内容有问题，请联系我们协助你处理。<br>微信： QQ：</p>
</div>
</div>
<div class="theme-popover-mask"></div>
<script>
//menu
$(".header .menu").on("click", function(){
$("body").append("<div class=\"mask-bg menu-mask-bg\"></div>");
$(".menu-slide").show();
$("html,body").css({height:$(window).innerHeight(), overflow:"hidden"});
setTimeout(function(){
$(".menu-slide").css({transform:"translateX(-50px)"});
},50)
});
$("body").on("click", ".menu-mask-bg", function(){
$(".menu-slide").css({transform:"translateX(-100%)"});
$(".menu-mask-bg").remove();
$("html,body").removeAttr("style");
setTimeout(function(){
$(".menu-slide").hide();
},300)
});
//search
$(".header .search").click(function(){
if($(".search-box").is(":hidden")){
$(this).children("i").removeClass("search-icon").addClass("close-icon");
$(".search-box").fadeIn("fast");
}else{
$(this).children("i").removeClass("close-icon").addClass("search-icon");
$(".search-box").fadeOut("fast");
}
});
//nav
if($(".nav").length > 0) {
var nav = new Swiper(".nav",{
slidesPerView: "auto"
});
}
</script>
<script>
$(".pay1 img").click(function () {
$(".wxpay").css("display", "block");
$(".alipay").css("display", "none");
$(".pay1 img").addClass("over");
$(".pay2 img").removeClass("over");
});
$(".pay2 img").click(function () {
$(".wxpay").css("display", "none");
$(".alipay").css("display", "block");
$(".pay1 img").removeClass("over");
$(".pay2 img").addClass("over");
});
</script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('.word-pic a').click(function(){
$('.theme-popover-mask').fadeIn(100);
$('.theme-popover').slideDown(200);
$(".vip-up").hide();
$(".vip-pay").hide();
var downid = '1049951'
$('.wxpay a').click(function(){
var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=wx&aid=';
payurl = payurl.replace('payment', 'youke');
var gotourl = payurl + downid
location.href = gotourl;
});
$('.alipay a').click(function(){
var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=ali&aid=';
payurl = payurl.replace('payment', 'youke');
var gotourl = payurl + downid
location.href = gotourl;
});
})
$('.theme-poptit .close').click(function(){
$('.theme-popover-mask').fadeOut(100);
$('.theme-popover').slideUp(200);
})
})
</script>
<script src="/js/gobacktop.js" type="text/javascript"></script>
</body>
</html>