HTML基础

2019-02-17 本文已影响0人 woochen123

//无序列表，ul标签里面只放li标签，li标签中可以放其他标签
<ul>
      <li>苹果</li>
      <li>香蕉</li>
      <li>荔枝</li>
</ul>

//有序列表
<ol>
      <li>A</li>
      <li>B</li>
      <li>C</li>
</ol>

//自定义列表
<dl>
      <dt>水果</dt>
      <dd>苹果</dd>
      <dd>香蕉</dd>
      <dt>蔬菜</dt>
      <dd>黄瓜</dd>
      <dd>包菜</dd>
</dl>

表格 table

<table boder="0" cellspacing="0" cellspadding="0">
<caption>表格标题</caption>
<thead>
  <tr>
    <th>名称</th>
    <th>价格</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>香蕉</td>
    <td>5元</td>
  </tr>
  <tr>
    <td colspan="2">香蕉</td>//跨列合并
  </tr>
 <tr>
    <td rowspan="4">香蕉</td>//跨行合并
  </tr>
</tbody>
</table>

表单(表单域+表单控件+提示文本)

//表单控件
<form action="url" method="post"></form>
//lable标签(关联input使用)
<lable for="input的id"></lable>
//普通文本
<input type="text" name="username" value="默认值"/>
//密码文本
<input type="password" name="password" value="默认值"/>
//普通按钮
<input type="button" name="点击" value="默认值"/>
//提交按钮(表单)
<input type="submit" value="提交"/>
//文件上传
<input type="file" value="提交"/>
//重置按钮(表单)
<input type="password" name="password" value="默认值"/>
//单选(name需要相同)
男<input type="check" name="sex"  checked="checked"/>
女<input type="text" name="sex" />
//多选(name最好也相同)
篮球<input type="selected" name="love"  checked="checked"/>
象棋<input type="selected" name="love"  checked="checked"/>
//下拉选择
<select>
  <option>请选择</option>
  <option selected="selected">足球</option>
  <option>足球</option>
</select>
//文本域
<textarea>不支持富文本</textarea>

<html>
<head>
       <title></title>
      <base  target="_blank"/>
</head>
<body>
      <h1>这是标题</h1>
      <p>这是段落，这是段落</p>
      <a>这是超链接</a>
</body>
</html>

2.特殊字符

空格 &nbsp
左括号 &lt
右括号 &gt

3.常用功能

锚点制作：

<a href ="#test">跳转到段落</a>
<p id="test">原文内容</p>

4.注意事项

1.<p>标签中一般只放文字
2.行内标签中一般只放行内标签
3.<a>标签中可以放块级元素

HTML基础

1.标签

2.特殊字符

3.常用功能

4.注意事项

猜你喜欢

热点阅读