XHTML常用标记
含义 | 标签 |
---|---|
段落 | p |
标题 | h1-h6 |
空格 |   |
加粗 | b,strong |
倾斜 | em |
换行 | br |
水平线 | hr |
删除线 | del |
大于号/小于号 | >大于 <小于 |
版权 | ©(圈C) |
HTML列表
列表是一种规定格式的文字排列方式,用于列举内容。常用的列表分为有序列表、无序列表和自定义列表。
有序列表
<ol>
<li>列表项1</li>
<li>列表项2</li>
……</ol>
在<ol,<li 中可以使用type、start属性。
- type属性用于设置编号的种类和格式,其取值如下:
l:编号为数字,默认值。例如:1,2,3,……
A:编号为大写英文字母。例如:A,B,C,……
a:编号为小写英文字母。例如:a,b,c,……
I:编号为大写罗马字符。例如:Ⅰ,Ⅱ,Ⅲ,……
i:编号为小写罗马字符。例如:ⅰ,ⅱ,ⅲ,……
有序列表
<ol type="a" start="3">
<li type="A">Java</li>
<li>Sevlet</li>
<li>Php</li>
</ol>
无序列表
<ul>
<li>列表项1</li>
<li>列表项2</li>
……</ul>
在<ul , <li 中都可以使用type属性。
- type属性取值如下:
disc:实心圆点,默认值。
circle:空心圆点。
square:实心正方形。
HTML超链接
<a href="资源地址">超链接文本及图像</a>
主要属性有:
href | 指定链接地址。若是链接到网站外部,必须为URL地址;若是链接到网站内部页面,只需指明该页面的绝对路径或相对路径。 |
target | 指定显示链接目标的窗口 |
alt | 本意是用于指定超链接的替换文本,但在IE浏览器中可以用它来定义提示信息,当鼠标停留在此热区上时,它的值会显示在鼠标指针位置处。 |
target可取如下值:
_self:默认值。当前窗口
_blank:新打开、未命名的窗口
_top:清除当前窗口并在整个浏览器窗口显示
_parent:当前窗口的父窗口
HTML表格
<table>
<tr>
<th> 表格第一列的标题</th>
<th> 表格第二列的标题</th>
… </tr>
<tr>
<td> 表格第一行的第一个单元格内容</td>
<td> 表格第一行的第二个单元格内容</td>
… </tr>
<tr>
<td> 表格第二行的第一个单元格内容</td>
<td> 表格第二行的第二个单元格内容</td>
… </tr>
…</table>
代码效果如下:
… … … …表格第一列的标题 | 表格第二列的标题 |
---|---|
表格第一行的第一个单元格内容 | 表格第一行的第二个单元格内容 |
表格第二行的第一个单元格内容 | 表格第二行的第二个单元格内容 |
table的常用属性:
border | 设置表格边框的宽度,若为0表示边框不可见,单位为像素 |
cellspacing | 设置单元格边框到表格边框的距离,单位为像素 |
width | 设置表格宽度。其值可为整数,单位为像素,如:100表示100像素;也可以是相对页面宽度的相对值,如:20%表示表格宽度为整个页面宽度的20%。 |
bordercolor | 设置表格边框颜色。align:设置表格在水平方向的对齐方式,其值可为left、right、center。 |
height | 设置表格高度,取值方式与width一致。bgcolor:设置表格背景色。可以是十六进制代码,也可以是英文字母, |
valign | 设置表格在垂直方向的对齐方式,其值可为top、middle、baseline。 |
tr 常用属性
bordercolor | 设置该行的外边框颜色。 |
bgcolor | 设置该行单元格的背景颜色。 |
height | 设置该行的高度。 |
align | 设置该行各单元格的内容在水平方向的对齐方式,其值可为left、right、center。 |
valin | 设置该行各单元格的内容在垂直方向的对齐方式,其值可为top、middle、bottom。 |
td 常用属性
colspan | 设置单元格所占的列数,默认值为1。 |
rowspan | 设置单元格所占的行数,默认值为1。 |
background | 设置单元格背景图像。 |
width | 设置单元格宽度。 |
示例代码:
<table border="1" width="80%" bordercolor="blue" cellpadding="2">
<tr height ="50" valign="middle" bgcolor="yellow">
<th width="33%" colspan="2">Java方向</th>
<th width="33%" colspan="2">软件测试</th>
<th width="34%" colspan="2">.NET方向</th>
</tr>
<tr align="center" bgcolor="red">
<td width="16%">Java程序设计</td>
<td width="16%">数据库技术</td>
<td width="17%">Java程序设计</td>
<td width="17%">数据库技术</td>
<td width="17%">C#程序设计</td>
<td width="17%">数据库技术</td>
</tr>
<tr align="center" bgcolor="blue">
<td width="16%">JSP程序设计</td>
<td width="16%">JavaEE技术</td>
<td width="17%">JSP程序设计</td>
<td width="17%">软件测试理论</td>
<td width="17%" bgcolor="white">ASP程序设计</td>
<td width="17%">ADO.NET</td>
</tr>
</table>
示例效果:
Java方向 | 软件测试 | .NET方向 | |||
---|---|---|---|---|---|
Java程序设计 | 数据库技术 | Java程序设计 | 数据库技术 | C#程序设计 | 数据库技术 |
JSP程序设计 | JavaEE技术 | JSP程序设计 | 软件测试理论 | ASP程序设计 | ADO.NET |
来源:CSDN
作者:笙不凡
链接:https://blog.csdn.net/lucklydog123/article/details/104561654