您的位置：首页 > Web前端 > HTML

html精简总结基础部分

2006-07-26 15:01 507 查看

一.基本构架
<html>

<head>

<title>

标题

</title>

</head>

<body>

页面内容

</body>

</html>
二.基本属性
1.颜色 <body
bgcolor="#">，#为颜色可以为“red“，“blud”等英文单词，也可以是ffffff三原色代码

2.背景图片 <body backgroud＝"back-ground.gif">或<body
backgroud＝"images\back-ground.gif">注意所在文件夹的位置，后者的图片在文件夹images中

3.背景音乐 <bgsound src="background_sound.mid"
loop="-1"> loop表示循环次数，-1表示循环无数次。

4.空白大小 <body topmargin=0
leftmargin=0>,试试看有什么效果
三.字体
1.标题大小 <h#>今天天气真好！</h#>
#可以为1-6

2.普通字体大小 <font size=#>今天天气真好！</font>
#为数字

3.逻辑字体(Logical Style)
下划线：<u>文字</u>，代码：<code>文字</code>，删除
线：<strike>文字</strike>，闪烁：<blink>文字</blink>，增
强：<strong>文字</strong>，强调：<em>文字</em>，示
例：<samp>文字</samp>，还有老多，一般的这些了解一下就可以。

4.字体的标志，很常用的。粗体：<b>文字</b>，斜体：<i>文字</i>

5.字体颜色 <font color=#> 文字 </font>
预定义色彩：

Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,Fuchsia,
White, Green, Purple, Silver, Yellow, Aqua

对于16
进制编码的颜色，我们可以这样理解rrggbb六个字符：前两个表示红色，中间的两个表示绿色，后两个表示蓝色；那么，红色（red）ff0000，同样绿色（green）00ff00，蓝色0000ff；其它的颜色就是这几个字符（0-9，a-f）的组合。

6.字符实体(Entities) &#; #=字符实体名称或者 ascii
值

四.图片
例子：<img src=http://d.thec.cn/zhusd/2.jpg>

图象在页面中的对齐/布局： <img align=#> #=left, center,
right

图象和文字的对齐：

语法：<img align=#>
#=top, middle,
bottom，这里的align和上边的实现的效果不一样，大家从它的值可以看出，它所显示出来的是文字在图片的靠上边、中间、底端。大家可以对比这看看各自的效果，很容易记住哦！

图像的边框：<img border=#>
#=value数字，指的是这个图像的边的宽度！

示例：<img src="http://d.thec.cn/zhusd/2.jpg"
border=1>

五.表格
看看表格的基本语法：<table>...</table>
- 定义表格

<tr> ...</tr>- 定义表行

<th> ...</th>- 定义表头

<td> ...</td>- 定义表元

下面看看它的示例：

<table border="1">


<tr>



<th>Food</th><th>Drink</th><th>Sweet</th>

</tr>



<tr>

<td>A</td><td>B</td><td>C</td>


</tr>

</table>

不带边框的表格：

<table>

<tr>

<th>Food</th><th>Drink</th><th>Sweet</th>

</tr>

<tr>

<td>A</td><td>B</td><td>C</td>

</tr>

</table>

Food Drink Sweet

A
B

C

表格尺寸设置 <table
border=#>边框尺寸设置：
<table
border=10>

<tr><th>Food</th><th>Drink</th><th>Sweet</th>

<tr><td>A</td><td>B</td><td>C</td>

</table>

跨多列的表元 <th
colspan=#>
<table border>

<tr><th colspan=3>
Morning Menu</th>


<tr><th>Food</th>

<th>Drink</th>
<th>Sweet</th>

<tr><td>A</td><td>B</td><td>C</td>

</table>

跨多行的表元 <th
rowspan=#>
<table border>

<tr><th rowspan=3>
Morning Menu</th>

<th>Food</th>
<td>A</td></tr>

<tr><th>Drink</th>
<td>B</td></tr>

<tr><th>Sweet</th>
<td>C</td></tr>

</table>

还有属性如 <tableborderwidth=170
height=100>

<table border cellspacing=#>表元间隙设置：

<table border cellpadding=#>表元内部空白设置：

表格内文字的对齐/布局

<tr align=#>

<th align=#> #=left,
center, right

<td align=#>
<table border
width=160>

<tr>

<th>Food</th><th>Drink</th><th>Sweet</th>

<tr>

<td
align=left>A</td><td align=center>B</td>

<td
align=right>C</td>

</table>

<tr valign=#>

<th valign=#> #=top,
middle, bottom, baseline

<td valign=#>
<table border
height=100>

<tr>

<th>Food</th><th>Drink</th>

<th>Sweet</th><th>Other</th>

<tr>

<td valign=top>A</td>

<td valign=middle>B</td>

<td valign=bottom>C</td>

<td valign=baseline>D</td>

</table>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 职场基础 html 总结休闲

相关文章推荐

新的分享

章节导航