图像
|
同一级直接src = "example.gif"/
上级加入../ 可叠加
绝对路径加入file://c:/example.gif
设置大小
|
但是要注意失真
图像居中,左,右:
img不能实现
可以在h或p,但通常在div块中实现
<
div
align
=
"left"
>
<
img
src
=
"http://how2j.cn/example.gif"
/>
</
div
>
加入文字:
万一图片不存在,出现一个破损的都尴尬,加上一个 alt就好了
<
img
src
=
"http://how2j.cn/example_not_exist.gif"
alt
=
"这个是一个图片"
/>
超链:
<
a
href
=
"http://www.12306.com"
target
=
"_blank" title=
"跳转到http://www.12306.com"
>www.12306.com</
a
>
href表示要跳转的连接
target表示要不要新建一个空页面
title表示放上去的提示信息
而中间的文字表示你要显示出来的
那么既然<a>和</a>中间是要显示出来的
<a 属性href target title> 显示文字(可以是用img显示图片)</aj>
我们也可以
<
a
href
=
"http://www.12306.com"
>
<
img
src
=
"http://how2j.cn/example.gif"
/>
</
a
>
放个图片来让你点击
表格:
1-普通表格 tr td
tr(table row)表示行,所有3个tr元素
td(table data)表示列,每一行,有2列,所以每一个tr元素里,有2个td元素
2-设置大边框属性与单元格属性 border,width以及alignvalign水平垂直对齐
<table border
=
"1"
width
=
"200px"
>//红色部分为加入边框属性,
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td width
=
"50px"
>3</td>//红色部分为加入对1单元格的边框属性,对应的下面的也会继承,而旁边的会减去
<td>4</td>
</tr>
<tr>
<td width="80%" align=
"left"
>a</td>//也可以这样来设定单元格宽度比例,align用于设置文字在单元格中的位置,水平对齐
<td>b</td>
</tr>
</table>
1 | 2 |
3 | 4 |
a | b |
//1,3,a对映align的水平位置
valign用于设置文字垂直对齐
<
tr
>
<
td
valign
=
"bottom"
>a</
td
>
<
td
>
b <
br
/>
b <
br
/>
b <
br
/>
</
td
>
</
tr
>
1 | 2 2 2 |
3 | 4 4 4 |
a | b b b |
//1,3,a对应valign的垂直对齐
3-合并:
水平:colspan
<
tr
><td
colspan
=
"2"
>1,2</
td
></tr
>
垂直:rowspan
<table border="1" width="200px">
<tr>
<td rowspan="2">1,3</td>
<td>2</td>
</tr>
<tr>
<td>4</td>
</tr>
<tr>
<td>a</td>
<td>b</td>
</tr>
</table>
1,3 | 2 |
4 | |
a | b |
背景色:bgcolor
<
tr
bgcolor
=
"gray"
>
<
td
width
=
"50%"
>1</
td
>
<
td
>2</
td
>
</
tr
>//也可以放在td中
列表
列表分无序列表和有序列表
分别用<ul>标签和<ol>标签表示
<ul>
<li>DOTA</li>
<li>LOL</li>
</ul>
ul改成ol就是有序的,输出就会带有序号1- 2-
块
div span
<img style="margin-left:50px" src="http://how2j.cn/example.gif"/>
<br/>
<img style="margin-left:50px" src="http://how2j.cn/example.gif"/>
<div style="margin-left:100px" >
<img src="http://how2j.cn/example.gif"/>
<br/>
<img src="http://how2j.cn/example.gif"/>
</div>
将style属性放带div里面,则整个块都具有距离左边100px的属性
div是块元素,即自动换行
常见的块元素还有h1,table,p
span是内联元素,即不会换行
常见的内联元素还有img,a,b,strong
字体
使用<font>标签表示字体,包括color与size
<
font
color
=
"blue"
size
=
"+2"
>蓝色大2号字体</
font
>
内联框架
<
iframe
src
=
"http://how2j.cn/"
width
=
"600px"
height
=
"400px"
>
</
iframe
>
相当于在当前页面打开一个600*400的框,里面是相关网页