HTML笔记

HTML笔记

为了方便读者阅读以及自己回顾,我花费了两个小时,作出了以下整理。

<!DOCTYPE html><!-- 声明文档类型为html5 --><!-- 注释文字 -->
<html><!-- html标签为html文件的根标签 -->
<head><!-- head标签为头部标签,一般用来放置meta和title标签等 -->
    <meta charset="UTF-8"><!-- 声明当前文件字符集编码为utf-8 -->
    <!-- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> -->
    <title></title><!-- title标签设置浏览器标题 -->
    <style type="text/css"><!-- 书写CSS样式 -->
    </style>
    <!-- <link/> -->
</head>
<body><!-- body标签为我们网页的内容 -->
	<!-- 标题标签 -->
    <h1></h1><h2></h2>...<h6></h6>
    <!-- 水平分割线标签 -->
    <hr />
    <!-- 段落标签 -->
    <p>
    	<span>文本</span><!-- span标签用来设置单独的样式 -->
    	&nbsp;<!-- 空格 -->
    </p>
    <br /><!-- 换行 -->
    <div><!-- div标签的作用就相当于一个容器 -->
    	<header></header><!-- header标签代表头部,但作用等同于div,只是具备语义化 -->
    	<section></section><!-- section标签代表一个区域,但作用等同于div,只是具备语义化  -->
    	<aside></aside><!-- aside标签代表一个侧边栏区域,但作用等同于div,只是具备语义化  -->
    	<footer></footer><!-- footer标签代表底部,但作用等同于div,只是具备语义化  -->
    </div>
    <ul><!-- 无序列表 -->
    	<li>信息</li>
    	<li>信息</li>
    	......
    </ul>
    <ol><!-- 有序列表 -->
    	<li>信息</li>
    	<li>信息</li>
    	......
    </ol>
    <!-- 图片 -->
    <img src="图片地址" alt="下载失败时的替换文本" title="提示文本">
    <!-- 超链接(_self代表在当前页面打开链接,_blank代表在新窗口打开链接) -->
    <a  href="目标网址"  title="鼠标滑过显示的文本" target="_self(默认)/_blank">链接显示的文本</a>
    <!-- 表格标签 -->
    <table border="1"><!-- border属性代表给表格加上边框 -->
    	<caption></caption><!-- 表格标题标签 -->
    	<thead><!-- thead标签包裹的表头 -->
            <tr><!-- tr代表一行 -->
                <th></th><!-- th代表一列,有字体加粗的效果 -->
            </tr>
        </thead>
        <tbody><!-- tbody标签包裹的表身 -->
            <tr>
                <td></td><!-- td代表一列,字体为正常效果 -->
            </tr>
        </tbody>
        <tfoot><!-- tfoot标签包裹的表尾 -->
           <tr>
                <td></td>
            </tr> 
        </tfoot>
    </table>
    <!-- 表单标签 -->
    <form method="传送方式get/post" action="服务器文件">
    	<label for="控件id名称"><!-- 标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同 -->
    	<!-- 文本输入框、密码输入 -->
    	<input type="text/password" name="名称" value="文本" id="" value="" placeholder="" />
    	placeholder输入框占位符
    	<!-- 数字输入框 -->
    	<input type="number"/><!--  -->
    	输入框只能输入数字,输入其他字符无效,且最右边会有一个加减符,可以调整输入框数字的大小
    	<!-- 网址输入框 -->
    	<input type="url"/>
    	输入框的内容必须以http://或者https://开头,否则会给出错误提示
    	<!-- 邮箱输入框 -->
    	<input type="email"/>
    	如果输入框的内容不包含@符,则会给出错误提示
    	如果@后面没内容,也会给出错误提示
    	<!-- 单选框、复选框 -->
    	<input   type="radio/checkbox"   value=""    name="名称"   checked="checked"/>
    	当设置 checked="checked" 时,该选项被默认选中
    	<!-- 提交按钮 -->
    	<input   type="submit"   value="提交">
    	<!-- 重置安钮 -->
    	<input type="reset" value="重置">
    	重置表单信息
    	<!-- 下拉菜单 -->
    	<select>
    		<option value="提交值(向服务器提交的值)" selected="selected">选项(显示的值)</option>
    	</select>
    	<!-- 文本域 -->
    	<textarea  rows="行数" cols="列数">文本</textarea>
    </form>
</body>
</html>

最后,写一句话,与你我共勉:以颤抖之身追赶,怀敬畏之心挑战!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值