http://7xrp04.com1.z0.glb.clouddn.com/task_1_1_1.jpg
代码:
第一部分的
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p{
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<strong><h1>网站一级标题</h1></strong>
<ul>
<a href=""><li>导航链接一</li></a>
<a href=""><li>导航链接二</li></a>
<a href=""><li>导航链接三</li></a>
<a href=""><li>导航链接四</li></a>
</ul>
<h2>文章一级标题</h2>
<h2>文章二级标题</h2>
<p>文章作者 文章发表时间</p>
<br />
<p>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,<br/>换行了</p>
<p>这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,换行了<br />这是一个很长很长的段落,这是一个很长很长的段落,<a href="">这是有一个链接链接到http://ife.baidu.com</a>这是一个很长很长的段落,这是一个很长很长的段落,<strong>这里有个粗体</strong>这是一个很长很长的段<br />
落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,这是一个很长很长的段落,</p>
<br />
<img src="img/1.png" alt="" /><br />
</body>
</html>
遇到的问题:1、段落标签的使用,如果单独为每一行使用一个段落的话,每一行之间会有空隙达不到效果,这是因为行与行之间存在外边距、
2、标签之间的嵌套使用,如p与br
解决方法:让p标签包含几行 灵活运用嵌套
第二部分
<h1>另一篇文章的一级标题</h1>
<h1>文章的二级标题</h1>
<p>文章作者 文章发表时间</p>
<img src="img/1.png" alt="" /><br />
<ul>
<li>列表项目一</li>
<li>列表项目二</li>
<li>列表项目二</li>
</ul>
第三部分
<h1>最后一篇文章一级标题</h1>
<p>文章作者 文章发表时间</p>
<br />
<ol>
<li>排名1</li>
<li>排名2</li>
<li>排名3</li>
</ol>
<br />
<p>下面是一个表格,给表格加一个border="1"号让你看出是一个表格</p>
<table border="1">
<tr>
<td>表头</td>
<td>表头</td>
<td>表头</td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td>操作</td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td>操作</td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td>操作</td>
</tr>
<tr>
<td>表内容单元格</td>
<td>表内容单元格</td>
<td>操作</td>
</tr>
<tr>
<td>总计</td>
<td colspan="2">1000</td>
</tr>
</table>
遇到问题:如何制作表格?
总结:1、给表格加边框则在table标签中加属性border=“1”
2、tr决定行数,有几组tr就说明有几行;td决定列数,有几组td就说明有几列;有时列的内容本来1列的却占了两列,则在该列属性中加colspan="2",有时行的内容占2列
则rowspan="2"
第四部分
请输入邮箱地址:<input type="text"placeholder="这是一个文本输入框" />
<br />
<br />
邮箱地址请按要求格式输入<br />
请输入密码:<input type="password" placeholder="这是一个文本输入框"/> 请重复输入密码:<input type="password" placeholder="这是一个文本输入框"/>
<br />
密码请为6-16位英文数字
<br />
性别:<input type="radio" name="sex" />男 <input type="radio" name="sex"/>女
城市:<select name="city" id="">
<option value="">上海</option>
<option value="">广州</option>
<option value="" selected="selected">北京</option>
</select>
爱好:<input type="checkbox" name="bobby"/>运动 <input type="checkbox" name="hobby" />艺术 <input type="checkbox" name="hobby"/>科学
个人描述:<textarea name="" id="" >这是一个多行输入框,输入您的个人描述</textarea>
<input type="button" value="确认提交" />
<br />
版权所有©