网页基础
2018-01-05 16:32 看看乖哦 阅读(208) 评论(0) 编辑 收藏 举报2018.1.5
网页基础标签
1.<html>开始标签</html>-结束标签
2.<title>页面标题</title>
3.<body></body>页面显示内容
4.<body>属性
----bgcolor______背景颜色
----text_________文字颜色
----topmargin____上页边距
----leftmargin——左页边距
----rightmargin———右页边距
----bottomargin————下页边距
background________背景壁纸
5.<font>
---color=""-------字体颜色
----face=""-------字体
----size=""-------字体大小
----<b></b>------字体加粗
---<i></i>---------字体倾斜
----<u></U>------下划线
---- <strong></strong>------字体加粗（强调，语气加强）
----<em></em>-------字体倾斜（强调，语气加强）
----<center></center>-----居中
----<br>或</br>----相当于回车
---- -----表示空格
----<h1><h2><h3-4-5-6> 标题
----<p></p>-------段落标签
<div></div>-------层标签（默认一行）
<span></span>------层标签（多大占多少）
<ol>------有序列表
<ol type="1">(1 2 3 4 5 6)有序列表可改形式 a 1
<li></li>-------中间是内容
1·内容
2·内容
3·内容
</ol>-------无序列表（同上）
----“../”------表示上级目录
----“./”------表示当前目录
----相对路径----从当前页面开始查找
----绝对路径----从网站的跟开始查找
----<a>超链接
<a href="超链接地址" target=“—blank”>超链接文字</a>
----href(hyperlink reference):_blaank 是在新窗口打开。
----锚点
第一步：做锚点标签。<a nanme=""></a>
第二步：做锚点链接。<a href="目标链接的name的值"></a>
------图片标签
<img src="图片地址" alt="文字" width="数值" height="数值" (调整图片大小)
------表格
----<table></table>表格
---width---宽度
----height------高度
----border------边框。常用值“0”
----cellpadding---内容跟单元格边框的边距。常用值“0”
----cellpadcing---单元格之间的间距。常用值“0”
----align----对齐方式(一行的内容的水平对齐方式)
-----valign------对齐方式（一行的内容的垂直对齐方式）
----bgcolor----背景色
-----background------背景图片
-----<tr></tr>----行
-----<td></td>-----单元格
----<th></th>-----表头，单元格的内容自动居中。加粗
----colspan="n"-----合并同一行单元格（后面写代码要减去相应的列）
----rowspan="n"-----合并同一行单元格（从第二行开始要减去相应的列）
《网页基础标签代码》：
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>2018.1.5</title> </head> <body> <font color="#FF0000" face="华文行楷" size="+6"llllllllllllllllllllll</font><!--注释--><br> <b name="888">llllllllllllllllllll</b><br /> <i>llllllllllllllllllll</i><br /> <u>llllllllllllllllllll</u><br /> <strong>语气加重</strong><br /> <em>语气加重</em><br /> <center>zhongjian</center><br /> <b><i>br回车</i></b><br /> 空格& n d s p空      格<br /> <h1>dazi</h1><br /> <h6>xiaozi</h6><br /> <P> <font>111111<div>22222</div></font> <font>333333<span>4444</span></font> <ol type="I"> <li>oooooooooo</li> <li>oooooooooo</li> <li>oooooooooo</li> <li>oooooooooo</li> </ol> <ul type="circle"> <li>AAAAAA</li> <li>AAAAAA</li> <li>AAAAAA</li> <li>AAAAAA</li> <li>AAAAAA</li> <li>AAAAAA</li> </ul> <a href="Untitled-1.html">再开一张</a> <a href="Untitled-1.html" target="_blank">chaolianjiewenzi</a> <a href="888"></a> <img src="t01a36ff9fd888b4ba7.jpg" alt="888" width="200" height="200"/> </body> </html>
《网页基础标签网页显示》：
llllllllllllllllllll
llllllllllllllllllll
llllllllllllllllllll
语气加重
语气加重
br回车
空格& n d s p空 格
dazi
xiaozi
111111
3333334444
- oooooooooo
- oooooooooo
- oooooooooo
- oooooooooo
- AAAAAA
- AAAAAA
- AAAAAA
- AAAAAA
- AAAAAA
- AAAAAA
《表格代码》：
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="100%" height="30"><table width="100%" border="0"> <tr> <td width="30%" align="center">市网络学习中心</td> <td width="5%" align="center" bgcolor="#00CC99">首页</td> <td width="10%" align="center">编程课程</td> <td> 我的课程</td> <td width="8%">登录</td> <td width="12%">注册</td> </tr> </table></td> </tr> <tr> <td height="350" width="100%"><center><img src="t01a36ff9fd888b4ba7.jpg" width="70%" height="350" /></center></td> </tr> <tr> <td width="100%" height="40" align="center"><b>热门课程推荐</b></td> </tr> <tr> <td width="100%" height="700"><table width="100%" border="0"> <tr> <td width="10%" height="10"> </td> <td> </td> <td width="2%"> </td> <td> </td> <td width="2%"> </td> <td> </td> <td width="10%"> </td> </tr> <tr> <td width="10%" height="335"> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td width="2%"> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td> </td> </tr> <tr> <td height="10"> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td height="335"> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td> </td> <td><div>微信小程序（基础）</div> <div>微信小程序（wei xin xiao cheng xu），简称小程序，缩写XCX，英文名Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。</div></td> <td> </td> </tr> <tr> <td height="1%"> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> </table></td> </tr> <tr> <td width="100%" height="80" align="center" bgcolor="#0000FF"><p><font color="#FFFFFF">©2014-2017 111111111111111111111111111111111111111111</font></p> <p><font color="#FFFFFF">222222222222222</font></p></td> </tr> </table> </body> </html>
《表格网页显示》：
|
|||||||||||||||||||||||||||||||||||
| 热门课程推荐 | |||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||
|
©11111111111111111111111111111111111111 222222222222222222222222 |
