html学习笔记

标签最好开始标签、结束标签都写(包括< br >因为在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。)

后缀名:.html .htm

声明为 HTML5 文档

注释<!--注释内容-->

速查列表
HTML 标签简写及全称
基础标签

<html>元素是 HTML 页面的根元素
<head> 元素  
<!--可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript> 和 <base>-->
<!--
<base> 标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:
<link> 标签定义了文档与外部资源之间的关系。
-->
<title> 元素描述了文档的标题
<body> 元素包含了可见的页面内容
<h1> 元素定义一个大标题<h1>~<h6>大小粗细不同
<!--
请确保将 HTML 标题 标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用
标题。搜索引擎使用标题为您的网页的结构和内容编制索引。因为用户可以通过标题
来快速浏览您的网页,所以用标题来呈现文档结构是很重要的。应该将 h1 用作主标题
(最重要的),其后是 h2(次重要的),再其次是 h3,以此类推。-->
<p> 元素定义一个段落
<br>  换行标签
<hr>  水平线标签

常用标签

<a>  HTML 链接 通过标签 <a> 来定义的  
<!--例子:<a href="URL">这是一个链接</a>-->
<!--tip:在 href 属性中指定链接的地址;target="_blank":在新标签页中打开链接;id属性类似书签作用-->
<img>   图像定义  主要关注该标签的属性使用
<span> 用于对文档中的行内元素进行组合。
<span> 标签没有固定的格式表现。当对它应用样式时,它才会产生视觉上的变化。如果不对 <span> 应用样式,那么 <span> 元素中的文本与其他文本不会任何视觉上的差异。
<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
<table>  表格   
<!--
<tr> 行
<td> 列
<th> 表头使用
<caption>  标题
table属性:
border 规定表格单元周围是否显示边框   1表示显示边框  (0为不显示,有些地方说""表示不显示???)
cellpadding   单元格边距
cellspace     单元格间距
-->
列表
<ol>有序列表
<ul>无序列表
<li>列表项
自定义列表
<!--不仅仅是一列项目,而是项目及其注释的组合。-->
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始。
表单
<form>
<input>输入元素  <!--输入类型是由类型属性(type)定义的。-->
<!--
type属性:
text  文本类
password  密码类
radio  单选框  tip:通过name属性定义单选区间
checkbox  复选框
submit   确定按钮
button  按钮
-->
<select>下拉列表
<!--
通过<option>定义选项,在<option>中加selected表示预选项
-->
<fieldset>边框<!--<legend>加标题-->
区块
<div> 标签定义 HTML 文档中的一个分隔区块或者一个区域部分。
<div>标签常用于组合块级元素,以便通过 CSS 来对这些元素进行格式化。
<!--
提示:<div> 元素经常与 CSS 一起使用,用来布局网页。
注释:默认情况下,浏览器通常会在 <div> 元素前后放置一个换行符。然而,您可以通过使用 CSS 改变这种情况。-->
<span> 用于对文档中的行内元素进行组合。
框架 (一个页面内在放一个页面)
<iframe>
<!--
`src="URL"
`frameborder 属性用于定义iframe表示是否显示边框。
      设置属性值为 "0" 移除iframe的边框
`使用iframe来显示目标链接页面
     iframe可以显示一个目标链接的页面
     目标链接的属性必须使用iframe的属性,如下实例:
     <iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="http://www.runoob.com" target="iframe_a" rel="noopener">RUNOOB.COM</a></p>
点<a>所表示的链接时在框架中显示。
-->

属性

  • HTML 属性常用引用属性值

属性值应该始终被包括在引号内。 双引号是最常用的,不过使用单引号也没有问题。 Remark提示:
在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号,例如:name=‘John “ShotGun” Nelson’

全局属性列表包括lang、class、id、…

文本格式化标签

<sup>上标
<sub>下标
<b><strong>加粗
<i><em>斜体
<ins>插入字  (有下划线)
<del>删除字   (有删除线)
<!--通常标签 <strong> 替换加粗标签 <b> 来使用, <em> 替换 <i>标签使用。然而,这些标签的含义是不同
的:<b> 与<i> 定义粗体或斜体文本。<strong> 或者 <em>意味着你要呈现的文本是重要的,所以要突出显示。
现今所有主要浏览器都能渲染各种效果的字体。不过,未来浏览器可能会支持更好的渲染效果。-->
<small> 字变小
<big>   字变大

更多

细节tip

注释: 请始终将正斜杠添加到子文件夹。假如这样书写链接:href=“https://www.runoob.com/html”,就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址,然后创建一个新的请求,就像这样:href=“https://www.runoob.com/html/”。

源代码中连续的空白字符(包括空格、回车)在浏览器中只会显示一个空格

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值