HTML练习

    
<!DOCTYPE>
<html>
<head>
<meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" />
<style type= "text/css" >
h1 { color : red }
p { color : blue }
</style>
</head>
<body bgcolor= "white" background= "/img/wangxiulin.jpg" >
<h1 align= "center" >hello,welcome to my website </h1>
<h2>Never lose my style </h2>
My sinablog
<p><a href= "http://blog.sina.com.cn/henaimumu/" target= "_blank" >www.blog.sina.com.cn/henaimumu </a></p>
HTML折行
<p>This is a <br/> paragraph <br/>with line breaks </p>
文本格式化
<p>
This text is normal <br/>
<b>This text is bold </d><br/>
<strong>This text is strong </strong><br/>
<a href= "/example/html/wangxiulin.html" >
<img src= "/img/ocean.jpg" align= "right" ismap /></a>
<big>This text is big </big><br/>
<em>This text is emphasized </em><br/>
<i>This text is italic </i><br/>
<small>This text is small </small><br/>
This text contains <sub>subscript </sub><br/>
This text contains <sup>superscript </sup><br/>
This text <del>text </del> is normal <br/>
This <ins>text </ins> is normal <br/>
</p>
预格式文本
<p>pre is suited to show computer code: </p>
<pre>
for i=1 to 10
    printf i
next i
</pre>
<code>computer code </code><br/>
<kbr>Keyboard input </kbr><br/>
address
<address>
<a href= "809160703@qq.com" >my mailbox </a><br/>
    School of Information and Communication Engineering <br/>
    Dalian University of Technology <br/>
</address>
缩写和首字母缩写
<abbr title= "wangxiulin" >wxl </abbr>
<acronym title= "Dalian University of Technology" >DUT </acronym>
文字方向
<br/>
<bdo dir= "rtl" >
This is a text
</bdo>
<br/>
<p>
<img src= "/img/funny1.gif" />
块引用
this is a short quote
<blockquote>
this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote this is a long quote
</blockquote>
</p>
没有下划线的链接
<a href= "/example/html/wangxiulin.html" target= "_top" style= "text-decoration:none" >
This is a link!
</a>
<a name= "tips" >basic matters need attention:helpful fint </a>
<a href= "#tips" >helpful fint </a>
<table border= "4" >
<caption>Whose table </caption>
<tr>
    <td bgcolor= "green" >
    <p>vacant table1 </p>
    </td>
    <td>
        <table frame= "above" width= "300" border= "1" bgcolor= "purple" >
        <tr>
            <th> &nbsp; </th>
            <th>X </th>
            <th colspan= "2" >YZ </th>
        </tr>
        <tr>
            <th>A </th>
            <td>200 </td>
            <td>300 </td>
            <td>400 </td>
        </tr>
        <tr>
            <th rowspan= "2" >BC </th>
            <td>500 </td>
            <td>600 </td>
            <td>700 </td>
        </tr>
        <tr>
            <td>500 </td>
            <td>600 </td>
            <td>800 </td>
        </tr>
    </table>
    </td>
</tr>
<tr>
    <td>
        <ul>
        <li>apple1 </li>
            <ul>
                <li>apple1.1 </li>
                <ul>
                    <li>apple1.1.1 </li>
                    <li>apple1.1.2 </li>
                </ul>
                <li>apple1.2 </li>
            </ul>
        <li>apple2 </li>
        <li>apple3 </li>
        <ul>
    </td>
    <td>
        <table>
        <tr>
            <td>
                <ol type= "A" >
                    <li>apple1 </li>
                    <li>apple2 </li>
                    <li>apple3 </li>
                <ol>
            </td>
            <td>
                <div style= "color:#00FF00" >
                <dl>
                    <dt>apple1 </dt>
                    <dd>apple1 is an apple </dd>
                    <dt>apple2 </dt>
                    <dd>apple2 is an apple </dd>
                </dl>
            </div>
            </td>
        </tr>
        </table>
    </td>
</tr>
</table>

<hr/>
two pictures of my friends
<img src= "/img/funny.gif" align= "right" />
<img src= "/img/funny.gif" alt= "向左转" />
<br/>

<ht/>
<img src= "/img/wangxiulin1.jpg" width= "1000" height= "600" />
vacant row
<br/>
horizontal row line
<hr/>
<img src= "/img/wangxiulin2.jpg" width= "1000" height= "600" />
<p>友情赞助 </p>
<p><a href= "http://blog.sina.com.cn/henaimumu/" target= "_blank" ><img src= "/img/sinablog.jpg" ></a></p>
   
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: HTML 练习题和答案 1. 编写一个 HTML 文件,并在其中添加一个段落标签(<p>),在段落中写下你的姓名和年龄。 答案: ```html <html> <head> <title>练习题</title> </head> <body> <p>我的姓名是张三,年龄是20岁。</p> </body> </html> ``` 2. 创建一个 HTML 表格,并在表格中添加两行两列的数据。 答案: ```html <html> <head> <title>练习题</title> </head> <body> <table> <tr> <td>姓名</td> <td>年龄</td> </tr> <tr> <td>张三</td> <td>20岁</td> </tr> </table> </body> </html> ``` 3. 在 HTML 页面中插入一张图片。 答案: ```html <html> <head> <title>练习题</title> </head> <body> <img src="image.jpg" alt="图片描述"> </body> </html> ``` 4. 创建一个有序列表,并在列表中添加三个项目。 答案: ```html <html> <head> <title>练习题</title> </head> <body> <ol> <li>项目1</li> <li>项目2</li> <li>项目3</li> </ol> </body> </html> ``` 5. 创建一个链接,链接到另一个网页。 答案: ```html <html> <head> <title>练习题</title> </head> <body> <a href="https://www.example.com">点击这里访问另一个网页</a> </body> </html> ``` ### 回答2: HTML 练习题和答案是为帮助学习者巩固和提升他们在HTML方面的知识,以下为一些常见的HTML练习题和答案: 1. 创建一个HTML文件,包含一个标题为"我的第一个网页"的标题标签。 ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> </body> </html> ``` 2. 在第一个网页中,添加一个段落标签,内容为"欢迎来到我的网页!"。 ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <p>欢迎来到我的网页!</p> </body> </html> ``` 3. 在第一个网页中,添加一个链接,链接到www.example.com网站。 ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <p>欢迎来到我的网页!</p> <a href="http://www.example.com">点击这里访问www.example.com</a> </body> </html> ``` 4. 创建一个无序列表,包含三个列表项:“苹果”,“香蕉”和“橙子”。 ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <p>欢迎来到我的网页!</p> <a href="http://www.example.com">点击这里访问www.example.com</a> <ul> <li>苹果</li> <li>香蕉</li> <li>橙子</li> </ul> </body> </html> ``` 5. 在第一个网页中嵌入一张图片,图片名称为"example.jpg",宽度为300像素,高度为200像素。 ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <p>欢迎来到我的网页!</p> <a href="http://www.example.com">点击这里访问www.example.com</a> <ul> <li>苹果</li> <li>香蕉</li> <li>橙子</li> </ul> <img src="example.jpg" alt="示例图片" width="300" height="200"> </body> </html> ``` 这些练习题和答案可以帮助学习者熟悉HTML的基本语法和标签,并且通过练习提升实践能力。随着练习的深入,学习者可以尝试更复杂的HTML练习题,以拓宽自己的HTML知识。 ### 回答3: HTML练习题和答案可以根据不同的难度和主题来设计。以下是一个简单的例子: 练习题1: 假设我们要创建一个简单的网页,其中包含一个标题和一个段落。请使用HTML代码编写这个网页。 答案1: ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <h1>欢迎来到我的网页</h1> <p>这是一个段落。</p> </body> </html> ``` 练习题2: 在上面的网页基础上,我们想要在段落中添加一个链接,链接到另一个网页。请添加这个链接的HTML代码。 答案2: ```html <!DOCTYPE html> <html> <head> <title>我的第一个网页</title> </head> <body> <h1>欢迎来到我的网页</h1> <p>这是一个段落,你可以访问 <a href="https://www.example.com">另一个网页</a>。</p> </body> </html> ``` 这些练习题旨在帮助初学者熟悉HTML标记语言的基础语法和常用元素。对于更高级的HTML练习题和答案,可以参考相关教程、书籍和在线资源。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值