HTML5基础知识学习笔记(2)

列表标签:
-<ol>: 有序列表
-<ul>: 无序列表
-<li>: 列表项
-<dl>:列表
-<dt>:列表项
-<dd>:描述

常用列表示例:
无序列表:
<ul type=”square”>
<li>第1个</li>
<li>第2个</li>
<li>第3个</li>
<li>第4个</li>
</ul>
使用标签:<ul>,<li>
属性: disc,circle,square 代表了列表前的符号样式

有序列表:
<ol start=”10”>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ol>
使用标签:<ol>,<li>
属性 :A,a,l,i,start 表示有序列表前面的数字样式

嵌套列表:
<ul>
<li>动物</li>
<ul>
<li>小狗</li>
<li>小猫</li>
</ul>
<li>植物</li>
<ul>
<li>小草</li>
<li>小花</li>
</ul>
<li>人类</li>
</ul>
使用标签:<ul>,<ol>,<li>

自定义列表:
<dl>
<dt>ahah</dt>
<dd>sssssssss</dd>
<dt>ahah</dt>
<dd>sssssssss</dd>
<dt>ahah</dt>
<dd>sssssssss</dd>
</dl>
使用标签:<dl>,<dt>,<dd>

9.HTML块的使用

HTML块元素:块元素显示时,通常会以新行开始
一般有:<h1>、<p>、<ul>
HTML内联元素:内联元素通常不会以新行开始
一般有:<b> 、<a> 、<img>
HTML<div>元素: div元素也被称为块元素,其主要是组合HTML元素的容器
HTML<span>元素: span是内联元素,可作为文本的容器

10.HTML5的布局

一般可以使用div进行布局,也可以使用table进行布局,使用这两个标签可以搭出一个网页的大体框架,然后往其中提充具体的细节元素;

11.HTML5的表单

表单常用标签:
<form>:表单
<input>:输入框
<textarea>:文本框
<label>:控制标签
<fieldset>:定义域
<legend>:域的标题
<select>:选择列表
<optground>:选项组
<option>:下拉列表中的选项
<button>:按钮
常用的表单:
复选框表单:
eg: 请选择你喜欢吃的水果:
苹果<input type=”checkbox”>
香蕉<input type=”checkbox”>
水蜜桃<input type=”checkbox”>
单选按钮:
eg: 请选择你的性别:
男<input type=”radio” name=”sex”>
女<input type=”radio” name=”sex”>
下拉框:
eg:<select>
<option>上海</option>
<option>南京</option>
<option>北京</option>
</select>
文本域:
eg:<textarea cols=”30” rows=”10”>please input your message here…</textarea>
按钮:
eg:<input type=”submit” value=”提交”>
<input type=”button” value=”提交”>
表单提交数据到服务器:
eg:<form action=”” method=”get”>
<table>
<tr>
<th colspan=”2”>登录</th>
</tr>
<tr>
<td>用户名:</td>
<td><input type=”text” name=”name”></td>
</tr>
<tr>
<td>密码:</td>
<td><input type=”password” name=”password”></td>
</tr>
<tr>
<td colspan=”2”><input type=”submit” value=”提交”></td>
</tr>
</table>
</form>

12.HTML5的框架

frame:框架标签
框架对于页面设计有着很大的作用

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/b842ee5773a6456ac748c016df3241cd.html