四期学习小组

HTML第一阶段四五天

2017-04-21  本文已影响3人  02af5b14e328

1、列表

ul 和ol中尽量不要嵌套其他的标签

但是li 标签里面可以嵌套其他标签

1.1、无序列表(unorder list)

<ul>

 <li>XXX</li>

</ul>

1.2、有序列表(order list)

<ol>

<li>XXX</li>

</ol>

1.3、自定义列表

<dl>

<dt>名词1</dt>   (标题)

<dd>名词1解释</dd>(列表项)

<dd>名词1解释1</dd>

 </dl>

1.4、表格标签

<table>(整个表格)

<tr>(一行)

<td>  </td>(一个单元格)

</tr>

</table>

1.4.1<thead>标签

<thead>  表格头部

<tr>

<th>____</th>

</tr>

</thead>

<tbody>

<tr>    <td> ___</td>    </tr>

</tbody>

1.4.2、合并单元格

<td rowspan="X">合并单元格<./td>-----------一个单元格占用X行

<td colspan="X"> 合并单元格 </td>-----------一个单元格占用X列

2、节标签

emmet语法快速标号并复制多个标签

<div>  与< span>标签

前者是块级标签:独占一行

后者是行级标签:可以跟其他的行内标签共用一行

块级标签有:p, div, ul, ol, dl ,li ,dt, h1-h6

行级标签:span, strong, em 文本相关的标签

3、表单<form>标签

所有的表单标签必须包裹在<form>标签中

<form    action(属性)="指向后台一个地址">

用户名:<input type="text" value="    ">--------属性type为text时表现为文本框,value属性为文本框中的默认值

密码:<input type=" password" >------文本框中不显示输入的内容,显示······。

性别:男<input  type="radio"  checked=" checked"name=" sex">  女<input   type="radio"  name" sex"> ------radio 为单选框,定义为同一name则只能选择一个,checked为默认已勾选,单属性,可以不加后面的内容。

下拉列表框

<select name="  "  id="  " multiple="multiple">------multiple属性是生成一个展开的下拉列表,并且如果属性 与属性名相同,则可以不写=及后面的引号内容,单属性。

<option value=" " >XXX</option>

</select>

多选框

<input type="checbox">

<input type="checbox">

<input type="checbox">

</form>

提交按钮

<input type="submit" value="按钮的名称"> 

    or

<input type="button" value="按钮的名称">

重置按钮

<input type="reset" value="重置">

Lable标签:使包裹的内容获得焦点,光标移动至此处

<label for="id">    XXXX  </label>  for属性:指向要提供服务的标签的id值。

两种写法:

文本域标签:输入大量的文本

<textarea cols(列)=" "  row(行)="  "> XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

</texarea>

4、表单组合标签

<fieldset>

<legend>组合标题</legend>

</filedset>

5、iframe内联标签

不建议使用,现在都用div了

6、meta标签

6.1、<meta charset="UTF-8">

6.2、优化网页搜索SEO

<meta   name="keyword"  content="哈哈哈哈哈哈">

<meta  name="description"  content="哈哈哈哈">

6、base标签

<base  target="_blank ">

当前所有的超链接拥有相同的target属性 ,属性值也可以为其他标签里的name值!如iframe里的name值,若target为其name值,则在iframe框架中打开链接。

_blank:另一个页签打开超链接

_self:当前网页打开超链接

7、pre标签

<pre>   xxXXXX</pre>保留文本中的格式,不合并空格或回车

8、字符实体

上一篇下一篇

猜你喜欢

热点阅读