二、html常用标签、表格、表单

2 篇文章 0 订阅

Html常用标签

排版标签

标题标签

h1,h2,h3,h4,h5,h6

<h1>我是标题</h1>

段落标签

<p>  段落内容  </p>

水平线

<hr/>

换行标签

<br />

div span标签

div+span网页布局

<div> 我是div </div>    
<span>我是span</span>

文本格式化标签`

标签显示效果
< b>< /b> < strong>< /strong>粗体
< i>< /i>< em>< /em>斜体
< i>< /i>< i>< /i>删除线
< u>< /u>< ins>< /ins>下划线

标签属性


<img with="20px"/>

属性名:with
属性值:20
表示图片宽20px;

img

< img src=”图片路径” />

属性名属性值含义
srcurl图片路径
alt文本图片无法显示时的替换文本
title文本鼠标悬停时显示的内容
width像素图片宽
hegth像素图片高
border数字图片边框宽度

链接标签

< a href=”跳转目标” target=”目标窗口的弹出方式”>文本或图像
href:用于指定链接目标的url地址。
target:用于指定链接页面的打开方式,其取值有_self和_blank两种,其中_self为默认值在当前窗口打开,_blank为在新窗口中打开方式。

描点定位

1.使用“a href=”#id名>“链接文本”创建链接文本(被点击的)

2.使用相应的id名标注跳转目标的位置。
< h3 id=”two”>第2集

base标签

用于设置整体链接的打开方式
< base target=”blank”/>所有链接打开方式都为_blank

特殊字符标签

特殊字符描述字符代码
空格符&nbsp;
<小于号&alt
>大于号&gt
$和号&amp;
®注册商标&reg;
人民币&yen;
©版权&copy;
摄氏度&deg;
±正负号&plusmn;
×乘号&times;
÷除号&divide;
²平方&sup2;
³立方&sup3;

注释标签

<!-- 注释语句 -->

列表标签

“““
无序列表的各个列表项之间没有顺序级别之分,是并列的

<ul>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
</ul>
  1. ul中只能嵌套li,直接在ul标签中输入其他标签或者文字的做法是不被允许的。
  2. 之间相当于一个容器,可以容纳所有元素。
  3. 无序列表会带有自己样式属性,一般不用。

有序列表即为有排列顺序的列表,其各个列表项按照一定的顺序排列定义

<ol>
  <li>列表项1</li>
  <li>列表项2</li>
  <li>列表项3</li>
</ol>

自定义列表

<dl>
  <dt>名词1</dt>
  <dd>名词1解释1</dd>
  <dd>名词1解释2</dd>

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

</dl>

表格table

<table>
  <tr>
    <td>单元格内的文字</td>
  </tr>
</table>

1.table用于定义一个表格。
2.tr 用于定义表格中的一行
3.td /td:用于定义表格中的单元格,必须嵌套在tr

属性名含义常用属性值
border表格边框默认0像素`
cellspacing单元格和单元格边框之间的空白间隙,默认2像素
cellpadding单元格内容和单元格边框之间的空白间隙,默认1像素`
width表格宽像素`
height表格高像素`
align表格在网页中水平对齐方式left,center,right`

单元格合并

跨行合并:rowspan 跨列合并:colspan

表单标签

这里写图片描述

一个完整的表单通常由以下3个部分构成
表单控件
​ 包含了具体的表单功能项,如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
提示信息
​ 一个表单中通常还需要包含一些说明性的文字,提示用户进行填写和操作。
表单域
​ 他相当于一个容器,用来容纳所有的表单控件和提示信息,可以通过他定义处理表单数据所用程序的url地址,以及数据提交到服务器的方法。如果不定义表单域,表单中的数据就无法传送到后台服务器。

input控件

这里写图片描述

label

用于给input元素定义标注。绑定一个表单元素,点击label,被绑定的表单元素获得输入焦点。

<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male">

textarea文本域

<textarea cols="每行中的字符数" rows="显示的行数">
  文本内容
</textarea>

下拉菜单

<select>
  <option>选项1</option>
  <option>选项2</option>
  <option>选项3</option>
</select>

表单域

< form action=”url地址” method=”提交方式” name=”表单名称”>
各种表单控件
< /form>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值