html基础知识二

1.文件结构:
    HTML文件的固定结构:
    <html>
        <head>...</head>
        <body>...</body>
    </html>
    html是根标签
    head定义文档头部,包含: title, script, style, link, meta
    body是网页主要内容,包含:h1,h2-h6, p, a, img

    html标签建议使用小写。
    空标签加斜杠是更长远的保障,如<br />。
    语义化,标签的使用要遵循语义化。

2.文档头部
<head>
    <meta charset="utf-8">           文档字符解码格式,防止乱码
    <meta name="keywords" content="关键词">      提供给搜索引擎使用
    <meta name="description" content="描述">     提供给搜索引擎使用
    <meta name="viewport" content="width=device-width,initial-scale=1.0">     移动端浏览器的宽度与缩放
    <title>...</title>  文档标题
    <base href="" target="">   定义页面中所有链接默认的目标地址
    <link rel="" href="">  引入样式表css文件、favicon文件
    <style></style>      样式
    <script></script>    js代码
    <noscript></noscript>    不支持js代码时候执行
</head>

3.html属性
    html元素可以设置属性。
    属性位于开始标签。
    属性可以为元素添加附加信息。
    属性总是以名称/值对的形式出现,属性值用双引号括起来,值中有双引号的用单引号。如href="www.love.com"。
    如class,id,style,title

4.body部分
<!DOCTYPE html>       文档声明
<html>
<html>
<head>...</head>
<body>
    <h1>这是一个标题</h1>    最重要的标题,后面以此类推。
    <h2>这是一个标题</h2>
    <h3>这是一个标题</h3>
    <h4>这是一个标题</h4>
    <h5>这是一个标题</h5>
    <h6>这是一个标题</h6>
    <p>这是段落</p>
    <a href="链接地址" target="定义链接的文档在何处显示">这是链接,可以是文本,也可以是图片</a>target可以取值_blank,_self
    <img src="" alt="图片无法加载时候的替代文本" width="" height="" />   图片
    <map></map>图像地图,可以设置图片哪里可以点击哪里不能点击,使用<area shape="" coords="" alt="" href="">
    <hr />  水平线
    <!--这是注释-->    注释可以提高代码可读性,使代码更容易被理解,浏览器会忽视注释。
    <br />    折行

    html文本标签
    <b></b>  粗体文字
    <i></i>   斜体文字
    <em></em>   着重,表现为斜体
    <strong></strong>  强调,表现为粗体
    <small></small>  小号字
    <sub></sub>   定义下标字
    <sup></sup>   定义上标字
    <ins></ins>      定义插入字
    <del></del>      定义删除字

    计算机输出标签
    <code></code>   计算机代码
    <kbd></kbd>        地址
    <samp></samp>    计算机代码样本
    <var></var>     变量
    <pre></pre>     预格式文本,这个很重要。可以保存空格等全部格式

    html引文,引用,标签定义
    <abbr></abbr>                定义缩写
    <address></address>         定义地址
    <bdo></bdo>                    定义文字方向
    <q></q>                        短引用
    <blockquote></blockquote>    长引用
    <cite></cite>                定义引用、引证等
    <dfn></dfn>                 定义一个定义

    表格
    <table border="1">                        表格
        <caption></caption>        表格标题
        <colgroup>                定义表格列的组
            <col span="2" style="background-color:red">  定义表格列的属性
            <col style="background-color:yellow">
          </colgroup>
        <thead>                    表格页眉
            <tr>                    表格里的行
                <th></th>            表格表头的单元格,粗体居中
                <th></th>
            </tr>
        </thead>
        <tbody>                    表格主体
            <tr>
                <td></td>            表格里的单元格
                <td></td>
            </tr>
        </tbody>
        <tfoot>                    表格页脚
            <tr>
                <td></td>            表格里的单元格
                <td></td>
            </tr>
        </tfoot>
    </table>>             

    列表
    有序列表
    <ol>
        <li></li>
        <li></li>
    </ol>
    无序列表
    <ul>
        <li></li>
        <li></li>
    </ul>
    自定义列表
    <dl>
        <dt></dt>
        <dd></dd>
        <dt></dt>
        <dd></dd>
        <dd></dd>
    </dl>

    <div></div>     定义一块区域,块级元素
    <span></span>    需要添加样式时候使用,内联元素

    表单
    <form>          定义表单, input定义输入域,form有method和action属性
        <input type="txet" name="" value="">    文本框
        <input type="password" name="">          密码框
        <input type="radio" name="" value="">   单选按钮,属于同一组的单选按钮name相同
        <input type="checkbox" name="" value="">      复选框,同一组按钮的name相同
        <input type="submit" value="">             提交按钮
        <input type="reset" name="">
        <textarea rows="" cols=""></textarea>    文本域
        <select name="">                         下拉列表
            <option value=""></option>            下拉列表的选项
            <option value=""></option>
            <option value="" selected></option>  selected表示默认选中
        </select>
    </form>   multiple 属性规定输入字段可选择多个值
    <label></label>            label标签为 input 元素定义标注(标记),可以和input一起使用
    <button type="button"></button>        定义按钮,在 <button> 元素内部,可以放置文本或图像。这是该元素与使用 <input> 元素创建的按钮之间的不同之处。始终为 <button> 元素规定 type 属性。不同的浏览器对 <button> 元素的 type 属性使用不同的默认值。
  
    框架
    <iframe src="" width="" height=""></iframe>

    html颜色,由红绿蓝混合而成。
    颜色名  red blue white black  green gray
    颜色十六进制  #FFFFFF    0到F
    颜色RGB   rgb(255,255,255)   0到255

    字符实体(不要忘记分号!!!)
    实体名称  显示效果  描述     实体编号
    &nbsp;            空格      
    &lt;        <     小于号   <
    &gt;        >     大于号   >
    &amp;       &     和号     &
    &quot;      "     引号     "
    &copy;            版权     ©
    &trade;           商标     ™
    &reg;             注册商标  ®
    &times;           乘号     ×
    &divide;          除号     ÷
    &yen;             日元     ¥
</body>
</html>
 <html>
     <head>...</head>
     <body>...</body>
 </html>
时间: 2024-10-12 21:58:38

html基础知识二的相关文章

ASP.NET Core 2.2 基础知识(二) 中间件

原文:ASP.NET Core 2.2 基础知识(二) 中间件 中间件是一种装配到应用管道以处理请求和相应的软件.每个软件都可以: 1.选择是否将请求传递到管道中的下一个组件; 2.可在调用管道中的下一个组件前后执行工作. 管道由 IApplicationBuilder 创建: 每个委托都可以在下一个委托前后执行操作,.此外,委托还可以决定不将请求传递给下一个委托,这就是对请求管道进行短路.通常需要短路,是因为这样可以避免不必要的工作.比如: 1.静态文件中间件可以返回静态文件请求并使管道的其余

Java基础知识二次学习-- 第一章 java基础

基础知识有时候感觉时间长似乎有点生疏,正好这几天有时间有机会,就决定重新做一轮二次学习,挑重避轻 回过头来重新整理基础知识,能收获到之前不少遗漏的,所以这一次就称作查漏补缺吧!废话不多说,开始! 第一章  JAVA简介 时间:2017年4月24日10:23:32 章节:01章_02节 内容:jdk的配置与安装 完成情况:已经完成,cmd中javac提示出相关命令 时间:2017年4月24日10:30:39 章节:01章_04节 内容:输出HelloWorld 完成情况: 已经完成 javac先将

Java基础知识(二)

1,字符串 new String("abc")创建了几个对象? 一个或两个,如果常量池中原来有"abc",则只创建一个对象:如果常量池中原来没有字符串"abc",那么就会创建两个对象. String s="abc"; String s1="ab"+"c"; System.out.println(s==s1); 输出 true ,因为"ab"+"c"

Powershell基础知识(二)

上一节主要介绍Powershell可发现,面向对象,一致性等特性,以及Powershell命令是基于.Net对象等重要概念,以及Powershell命令的命名规范,详细内容点击这里. 这一节的Powershell基础知识主要包含以下知识点 获取命令的摘要信息. 获取命令的帮助信息. 总结. 获取命令的摘要信息 Powershell命令 Get-Command 可检索当前shell中所有可用的命令名称.在Powershell提示符输入 Get-Command ,输出的内容类似以下内容(以下只写出输

计算机科学基础知识(二)Relocatable Object File

一.前言 一个合格的c程序员(也可以叫做软件工程师,这样看起来更高大上,当然,我老婆心情不好的时候总是叫我"死打字的",基本也能描述这份职业,呵呵)需要理解编译.链接和加载的过程,而不是仅仅关注c语言的语法和词法.本文主要以此为切入点,描述linux系统下,一个普通的hello world程序的生命历程,并借机灌输一些程序编译时和运行时的基本术语和概念.当然,由于我本人是一个linuxer,因此借用linux来描述这些知识会方便些,但是对于计算机科学而言,这些东西概念上是类似的,只是实

Java基础知识二次学习-- 第二章 基础语法与递归补充

第二章 基础语法与递归补充   时间:2017年4月24日10:39:18 章节:02章_01节,02章_02节 视频长度:49:21 + 15:45 内容:标识符,关键字与数据类型 心得:由字母,下划线,$,数字组成,应该由字母,下划线$开头,同时应该避开java保留字符 变量是内存中的一小块区域,使用变量名来访问这块区域 执行过程中的内存管理(疑问:这里的内存和Jvm的一样吗?) code segment 存放代码 data segment 静态变量 字符串常量 stack 栈 局部变量 h

jsp基础知识二(jsp动作指令)

动作指令与编译指令不同,编译指令是通知servlet引擎的处理消息,而动作指令只是运行时的动作.编译指令在将JSP编译成Servlet时起作用,而动作指令通常可替换成JSP脚本,它只是JSP脚本的标准化写法. (1)JSP:forward  执行页面转向,将请求的处理转发到下一个页面. (2)JSP:param  用于传递参数,必须与其他支持参数的标签一起使用 (3)JSP:include  用于动态引入一个JSP页面 (4)JSP:plugin 用于下载JavaBean或者Applet到客户端

css基础知识二

1.盒模型: 实际宽度:外边距*2+内边距*2+边框*2+内容宽度(注意这点,可解决界面元素轻微浮动问题,如hover有边框,以前没的时候会有轻微浮动) 作用:他规定了网页元素如何显示以及其相互关系 2.padding会撑大容器,而margin不会. 这点巧用(自己总结的):① 能用margin的别用padding ② 网页中为一个元素添加一边的下划线时候用padding ③ 导航栏中,用<ul><li>写的时候,先调节<li>的padding:npx,再调节<u

金子的PHP之禅(PHP基础知识二)

一.php的标记风格和注释 1.<?php ?> 2.<? ?> 3.<% %> 提示:如果要使用短标签方式需要在php.ini中开启short_open_tag 注释:采用//./* */等方式 二.数据类型 boolean (布尔型) string(字符型) int (整型) float (浮点型) array(数组) object(对象) null (特殊类型) 转换数据类型方法 比如:123转换成字符型 (string)123 比如:12323bac转换成整型

Java基础知识二次学习--第五章 数组

第五章 数组 时间:2017年4月26日15:11:30~2017年4月26日15:15:54 章节:05章_01节  视频长度:09:30 内容:一维数组的内存分析 心得: Java中数组是引用类型 栈里面存的数组的引用 实际对象在堆内存里面 (C与C++是分配在栈里的) 内存图: 元素为引用数据类型的数组 引用类型的数组如上图 时间:2017年4月26日15:16:22~2017年4月26日15:19:00 章节:05章_02节  视频长度:05:25 内容:数组元素的创建与使用 心得: 首