HTML基础知识

基本介绍

  • 超文本标记语言
超文本:实现超出文本范畴
标记:标签 <标签名>
  • 不严格的语言,不区分大小写
  • 不需要编译,通过浏览器直接运行

基本框架

<!DOCTYPE html><!--文本类型,一般有默认-->
<html><!--容器-->
	<head><!--头部:设置相关信息-->
		<mate charset="utf-8"><!--规定编码格式,防止乱码 -->
		<meta name="keywords" content="gg,hh" /> <!--搜索时的关键字 -->
		<title>标题</title>
	</head>
	<body><!--实体:显示在页面的内容-->
		<i><b>hello word</b></i>
	</body>
</html>

行级标记:不换行

<i></i>:斜体
-------------------------------------------
<b></b>:加粗
-------------------------------------------
<br />:换行
-------------------------------------------
<span></span>:行中文字
-------------------------------------------
<a href="链接" target="_blank"></a>:超链接  target(_blank):点击链接时在新的窗口打开

	锚机
	<a href="#botton" name="top"></a>:回到底部,此段放在文本最顶端
	<a href="#top" name="botton"></a>:回到顶部,此段放在文本最低端
-------------------------------------------
<img src="图片路径" width="宽度" height="高度" />:图片
-------------------------------------------
<audio controls>:音频
	<source src="音频路径" ></source>
</audio>
-------------------------------------------
<video width="宽度" height="高度" controls>:视频
	<source src="视频路径">
</video>

块级标记:换行

<h1></h1>~~~<h6></h6>:标题
-------------------------------------------
<p></p>:段落
-------------------------------------------
<hr />:水平线
-------------------------------------------
<div>:容器
-------------------------------------------
<ul>:无序项
	<li></li>
</ul>
-------------------------------------------
<ol>:有序项
	<li></li>
</ol>
-------------------------------------------
<dl>
	<dt></dt>:文字顶格写
	<dd></dd>:文字缩进写
</dl>
-------------------------------------------
<table border="1">:表格  border:有表格线
	<tr>:行
		<td bgcolor="单元格颜色 " rowspan="合并行的数量" colspan="合并列的数量"></td>:行内的列
	</tr>

	<tr>:行
		<td></td>:行内的列
	</tr>
</table>

表单

  • 代表提交数据库的一个整体,用户可输入
  • 一个页面可以有多个表单
<form action="" method="get:默认,显示所有的提交信息,用于不同的网站   post:隐藏信息,用于同一个网站"
	-------------------------------------------
	<label for="input的名字"></label> for:用来表示这个label是那个input的
	-------------------------------------------
	<span style="color: red;font-size: 10px;">***</span>:在某行内部设置文字
	-------------------------------------------
	<input name="h1" type="hidden" value="" />:隐藏域,不显示在网页中
	<input name="t1" type="text" value="默认值" maxlength="文本输入的最大长度" placeholder="" />:普通文本框,显示默认值value,最多可以输入maxlength,输入时自动消失的默认值
	<input name="p1" type="password" maxlength="文本输入的最大长度" />:隐藏输入的文本框(密码),最多可以输入maxlength
	
	<input name="r1" type="radio" value="男" checked="true" />
	<input name="r1" type="radio" value="女" />
	单选按钮(注意按钮的name要一样,一样表示在同一个分组中,否则可以多选)  checked:默认选择

	<input name="c1" type="checkbox" value="11" />
	<input name="c1" type="checkbox" value="22" />
	多选按钮(name一样表示在同一个分组中)

	<input type="reset" value="重置" />:重置按钮,点击后所有内容重置
	<input type="submit" value="提交" />:提交按钮,点击后所有内容提交
	<input type="button" value="普通" />:普通按钮,功能可通过js自己写

	<input name="f1" type="file" />:选择文件
	-------------------------------------------
	<textarea name="ar1" rows="行数" cols="列数"></textarea>:多行文本
	-------------------------------------------
	<select name="s1">:下拉列表
		<option value=""></option>:下拉选项
	</select>
</form>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值