Day 15:
1.常用开发工具
HBuilder,EditPlus,Eclipse
2. html 语法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- ①标签不能交叉嵌套 -->
正确:<p><i>早安,Alex</i></p>
错误:<p><i>早安,Alex</p></i>
<!-- ②标签必须正确关闭 -->
<!-- i.有文本内容的标签: -->
正确:<p>早安,Alex</p>
错误:<p>早安,Alex
<!-- ii.没有文本内容的标签: -->
正确:aaaaaa<br />bbbbbbbb
错误:aaaaaa<br>bbbbbbbb
<!-- ③属性必须有值,属性值必须加引号 -->
正确:<font color="blue">早安,Alex</font>
错误:<font color>早安,Alex</font>
错误:<font color=red>早安,Alex</font>
<!-- ④注释不能嵌套 -->
正确:<!-- 注释内容 -->
错误:<!-- 注释内容<!-- 嵌套的注释 --> 溢出的注释 -->
</body>
</html>
- 表格:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>first table</title>
</head>
<body>
<table border="1" align="center" width="80%">
<tr>
<tr>
<td>姓名<td/>
<td>性别<td/>
<td>地址<td/>
<td>邮箱<td/>
</tr>
<tr>
<td>马云<td/>
<td>男<td/>
<td>杭州<td/>
<td>mayun@aliyun.com<td/>
<tr/>
<table>
</body>
</html>
输出:
- 超链接:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<a href="pages/target.html">跳转到目标页面,目标页面有美女!</a>
</body>
</html>
输出:
- 表单:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="target.html" method="post">
用户名:<input type="text" name="uName" value="123" /><br />
<br />
密码:<input type="password" name="pwd" /><br /><br />
<!-- 提交按钮:type="submit",使用value属性指定它是页面上显示的文字 -->
<input type="submit" value="登录" />
</form>
</body>
</html>
输出:
- 单选框:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="target.html" method="get">
性别:
<input type="radio" name="gender" checked="checked" value="1" />男生
<input type="radio" name="gender" value="2" />女生
<input type="radio" name="gender" value="3" />东方不败<br /><br /><br /><br />
<input type="submit" value="提交" />
<br /><br />
</form>
</body>
</html>
输出:
- 列表
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 在这里创建无序列表 -->
<ul type="disc">
<li>火影忍者</li>
<li>死神</li>
<li>海贼王</li>
<li>名侦探柯南</li>
<li>网球王子</li>
</ul>
<br /><br />
<!-- 在这里创建有序列表 -->
<ol type="i">
<li>漩涡鸣人</li>
<li>黑崎一护</li>
<li>路飞</li>
<li>柯南</li>
<li>越前龙马</li>
</ol>
</body>
</html>
输出:
- 标题段落:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- 在这里创建标题 -->
<h1>江畔独步寻花</h1>
<h3>唐·杜甫</h3>
<!-- 在这里创建段落 -->
<p>黄四娘家花满蹊</p>
<p>千朵万朵压枝低</p>
<p>留连戏蝶时时舞</p>
<p>自在娇</p>
<h1>I love java</h1>
<h2>I love java</h2>
<h3>I love java</h3>
</body>
</html>
输出: