第1部分 HTML

<html>——开始标签

<head>

  网页上的控制信息

<title>页面标题</title>

</head>

<body>

  页面显示的内容

</body>

</html>——结束标签

<!——注释内容——>注释

body的属性:

bgcolor      页面背景色

text        文字颜色  

tomargin       上页边距

leftmargin     左页边距

rightmargin     右页边距

bottomargin    下页边距

background    背景壁纸

一般标签

格式控制标签

<font color="" face="" size=""></font>     控制字体; color="##FF0000";    face,字体;size,字体大小。

<b></b>           字体加粗

<i></i>            倾斜

<u></u>            下划线

<strong></strong>      字体加粗(强调,语气加强用)

<em></em>          字体倾斜(强调,语气加强用)

<center></center>      居中

<br>或<br/>          相当于回车

&nbsp;              表示空格  也可以在设计页面中按ctrl+shift+space

内容容器标签

<h1></h1>……<h6></h6>  标题(会自动换行)。HTML标题(Headling)是通过<h1>—<h6>等标签进行定义的。

<p></p>          段落标签(段落之间空行)

<div></div>         层标签(默认占一行)

<span></span>      层标签(默认用多大空间占多大空间)

<ol type="1">——有序列表,序号为1,2,3……,引号中可以更改序号形式

<li>内容</li>

<li>内容</li>

</ol>——上面“ol”改为“ul”则为无序列表

“../”表示上机目录

“./”表示当前目录

相对路径:从当前页面开始查找。

绝对路径:从网站的根开始查找。“/”,代表网站的根。

HTML元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

<!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 bgcolor="#66FF99" topmargin="200" leftmargin="200px" bottommargin="400">
<a name="top"></a>
今天<br>天气&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;不错。<br />
<font size="45" color="#FF0000">
格式控制标签:<br />
<b>文字加粗方式1,b标签</b><br />
<strong>文字加粗方式2,strong标签</strong><br />
<i>文字倾斜方式1,i标签</i><br />
<em>文字倾斜方式2,em标签</em><br />
<u>字体加下划线,u标签</u>
123<center>center居中标签。默认前后若有其他,执行上下换行,保证自身是一个整体</center>
<br />
内容容器标签:<br />
123<p>p标签,段落标签。默认前后若有其他,执行上下换行并且空开一行,表示内部是一个整体。</p>
<ol>有序列表,ol标签
<li>默认自带序号</li>
<li>默认自动换行</li>
<li>默认上下有空行</li>
</ol>
<ul>无序列表,ul标签
<li>默认自带序号</li>
<li>默认自动换行</li>
<li>默认上下有空行</li>
</ul>
<a href="http://www.baidu.com/" target="_blank">百度一下</a>
<img src="11.jpg" title="这是夕阳" alt="这应该是夕阳" /><br />
<a href="http://360.com/"><img src="11.jpg" width="600" /><br /></a>
<img src="11.jpg" width="400" height="200"/>

</font>
<h1>h1到h6标签,标题格式控制标签<h1>
<h2>默认换行<h2>
<h3>重要性依次递减<h3>
<h4>上下默认空行<h4>
<div style="background-color:#CF0">div层标签。默认是占用一行</div>
<span style="background-color:#60C">span层标签。默认使用多少就占多少</span><br />

<table width="400" height="90" border="0" cellpadding="0" cellspacing="0">
<tr align="center">
<td width="100">58同城</td>
<td width="100">赶集网</td>
<td width="100">百姓网</td>
<td width="100" rowspan="2" bgcolor="#FF6600">安居客</td>
</tr>
<tr align="center">
<td>太平洋汽车</td>
<td><a href="http://www.baidu.com/">汽车之家</a></td>
<td>易车网</td>

</tr>
<tr align="center">
<td colspan="2" bgcolor="#660033">天猫</td>

<td>京东</td>
<td>唯品会</td>
</tr>
</table>

<a href="#top">返回最顶端</a>
</body>
</html>

常用标签

超链接标签

<a href="超链接地址" target="_blank">超链接的文字</a>    ——href(hyperlink reference);_blank是在新窗口打开。

第一步:做锚点的标签。<a name=""></a>

第二步:做锚点链接。<a href="目标链接的name 的值"></a>

图片标签

<img src="图片地址"alt="文字" width=""height=""/>——高跟宽设置一个即可,显示图片会按比例缩放。alt在图片无法加载时,显示文字,还可帮主搜索引擎搜索。

表格与表单

表格

<table></table>表格

width:宽度。可以用像素或百分比表示。常用960像素。          

border:边框。常用值0.

cellpadding:内容跟单元格边框的边距。常用值0.

cellspacing:单元格之间的间距。常用值0.

align:对齐方式。

bgcolor:背景色。

background:背景图片。

<tr></tr>行

align:一行的内容的水平对齐方式

valign:一行的内容的垂直对齐方式

height:行高

bgcolor:背景色

background:背景图片

<td></td>单元格

<th></th>表头,单元格的内容自动居中、加粗

align:单元格的内容的对齐方式

valign:单元格的内容的垂直对齐方式

width:单元格宽度

height:单元格高度

bgcolor:背景色

background:背景图片

内容必须放在单元格里,单元格必须放在行里,行必须放在表格里。设置单元格行高、列高时,会同时影响对应的行或列。

单元格合并:(建议尽量使用表格嵌套)

colspan="n"   合并同一行单元格(后面写代码要减去相对应的列)

rowspan="n"   合并同一列单元格(从第二行开始减去对应的列)

时间: 2024-10-07 02:44:25