任务1:零基础HTML编码
HTML <lable>
标签
- 所有主流浏览器都支持
<label>
标签。
Safari 2 或更早的版本不支持<label>
标签。 <label>
标签为 input 元素定义标注(标记)。
label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
<label>
标签的 for 属性应当与相关元素的 id 属性相同。- 标记通常以下面两种方式中的一种来和表单控件相联系:将表单控件作为标记标签的内容,这样的就是隐式形式,或者为
<label>
标签下的 for 属性命名一个目标表单 id,这样就是显式形式。
显式的联系:
<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSn" />
隐式的联系:
<label>Date of Birth: <input type="text" name="DofB" /></label>
第一个标记是以显式形式将文本 “Social Security Number:” 和表单的社会安全号码的文本输入控件 (“SocSecNum”) 联系起来,它的 for 属性的值和控件的 id 一样,都是 SSN。第二个标记 (“Date of Birth:”) 不需要 for 属性,它的相关控件也不需要 id 属性,它们是通过在 <label>
标签中放入 <input>
标签来隐式地连接起来的。
HTML <img>
标签
<img src="/i/eg_tulip.jpg" alt="上海鲜花港 - 郁金香" />
<img>
标签有两个必需的属性:src 属性 和 alt 属性。
HTML <input>
标签
- 在 HTML 中创建单选按钮。
<form>
男性:
<input type="radio" checked="checked" name="Sex" value="male" />
<br />
女性:
<input type="radio" name="Sex" value="female" />
</form>
- 在 HTML 页中创建文本框。用户可以选中或取消选取复选框。
<form>
我喜欢自行车:
<input type="checkbox" name="Bike">
<br />
我喜欢汽车:
<input type="checkbox" name="Car">
</form>
- 在 HTML 页面中创建简单的下拉列表框。下拉列表框是一个可选列表。
<form>
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected="selected">Fiat</option>
<option value="audi">Audi</option>
</select>
</form>
- tr 元素定义表格行,th 元素定义表头,td 元素定义表格单元。
tr—table row
th—table head
td—table data
th与td的区别:用th定义的单元格中的字体会加粗。