资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/html学习

html学习

YPHP / 2439人阅读

摘要：要养成良好的编写注释习惯。十六进制满进只能用标志使用分别表示八进制满进。。。。字符集编码和解码所采用的规则，我们称为为字符集产生乱码原因编码和解码采用的字符集不同。如果同时制定宽度和高度，图像比例会发生变化。

什么是HTML？

  1. HTML:超文本标记语言。
  2. 所谓超文本也就是超链接,可以让我们从一个网页跳转到另一个网页。

HTML基本格式

                              
                              
        HTML入门      
    
    
    
        
Hello World

html：

  1. 根标签:只有一个（网页所有内容都应该写在根标签里面）

head:

  1. 子标签：用来设置头部内容

body:

  1. 子标签:网页主体,所有要显示的内容放这里面

title：

  1. 网页的标题标签，也就是网页显示名字。
  2. 搜索引擎检索页面时，会首先检索titlte中的内容。
  3. 元素：一个完整的标签<>
  4. 标签<>

HTML后缀名

  1. 将编写好的文件保存为.html网页格式文件

  2. 显示文件格式名

HTML注释

<！-- 这是一个注释的格式，可以直接换行
     继续写注释。
 -->
  1. 注释中的内容，不会显示在页面。
  2. 可以写注释来对代码进行描述，便于后期的维护。要养成良好的编写注释习惯。

标签属性


    
        HTML入门
    
    
    
        
Hello World ！

显示效果：

  1. 属性只能在开始标签中设置
  2. 属性名 ="属性值"
  3. 怎么知道有哪些属性，可以参考W3C

文档申明

  1. 主要用于申明网页版本最新为html5

  2. html5的文档申明，申明当前的网页是按照HTML5页标准编写的一定要放在网页的最上边，不申明，则会导致有些浏览器有些页面无法正常显示，所以为了避免，一定要写文档申明.

    

 
     HTML入门
 

 
     
    Hello World ！
    
     
     
    怎么知道有哪些属性？
    
     
    可以参考W3C

进制

二进制

​ 满2进1

​ 0 1 。。。。

十进制

​ 满10进1

​ 0 1 2 3 4 5 6 7 8 9 10 11 12 。。。。

十六进制

​ 满16进1

​ 只能用10 11 12 13 14 15标志

​ 使用a b c d e f 分别表示10 11 12 13 14 15

​ 0--f

八进制

​ 满8进1

​ 0 1 2 3 4 5 6 7 10 11 12 13 。。。。

常用十进制、二进制、十六进制

乱码问题

用PC自带记事本可以写html，但是效率不高。

常用html编写工具：

Sublime、notepad++等等

  1. 在计算机中保存的任何内容，都需要转为为0 1这种二进制来保存，包括在读取内容时，需要将二进制彪马，在转换为正确的内容。
  2. 编码： 一句一定的规则，将字符转换为二进制编码的过程。
  3. 解码：一句一定的规则，将二进制编码转换为字符的过程。
  4. 字符集：编码和解码所采用的规则，我们称为为字符集
  5. 产生乱码原因：编码和解码采用的字符集不同。
  6. 常用字符集：ASCII（最早）、IOS-8859-1、GBK（英文）、GB2312（中文）、UTF-8(万国码)

注意：中文系统浏览器，默认使用的是GBK进行解码

设置网页编码字符集

meta:用来这是网页的一些元数据，比如网页的字符集、关键字、简介

meta：是单标签



    
        
        HTML入门
    
    
    
        
Hello World ！

        
        
怎么知道有哪些属性？

        
可以参考W3C

ANSI:自动编码

我们使用都是UTF-8

标题标签

        
标题标签

        
标题标签

        
标题标签

        
标题标签

        
标题标签

        
标题标签

使用HTML标签时，关心的是标签的语义，我们使用的标签时语义化标签，所有表现都使用CSS来设置。

h1:对搜索引擎，重要性仅次于title标签

h1：非常重要，为影响搜索引擎中的排名

页面中只能写一个h1

一般只使用h1h2h3

段落标签

用于表示内容的一个自然段

使用P标签

我的一个p段落标签

p标签默认会占一行，端与端之间有间距

表现的都用css，html不关心

html都是语义标签

换行标签

空格：

      空格

换行标签


     换行，是一个单标签（自结束标签）

横线

    水平线，是一个自结束标签

实体(特殊元素)

特殊字符（实体）

<；    小于
>     大于

版权

©    版权

参考W3c实体

图片

支持图片格式：jpeg、gif、png

jpeg不支持透明，常用于保存图片颜色丰富的图片

gif支持的颜色少，支持动态图。支持简单透明。图片颜色单一用gif。

png支持的颜色多，并且支持复杂透明，可以用来显示颜色复杂的透明图片。

实际开发中常用png多一点。

图片使用原则：

​ 效果不一致，使用效果好的，

想过一致，使用小的。

alt“图片不能显示时，才显示。百度搜索只识别alt

只设置width或height时，高度或宽段会按比例自动变化。如果同时制定宽度和高度，图像比例会发生变化。

路径问题

一般使用相对路径：

返回上级目录

../     访问上级目录

绝对路径：直接在目录下面全路径

mate标签



    
        
        html练习笔记01
        
        
    
    
    
        百度一下
          
        淘宝
          
        京东
        
        

        
        
        
        
            a < b
            

            c > d
            

            ©邓凌

name:名字

content:内容

  1. 使用meta标签还可以用来设置网页的关键词

  2. 还可以用来制定网页的描述，搜索引擎在检索页面时，会同时检索页面中的关键词和描述，但是这两个值不会影响页面在搜索引擎中的排名

  3. 可以用来做请求的重定向

    content:

    ​ 5:时间秒数

    ​ url：重定向连接地址

HTML语法规范

XHTML：语法相对更严格

  1. HTML中不区分大小写的，但是我们一般都使用小写。有些情况还是使用大写。
  2. HTML中注释不能嵌套。
  3. HTML标签必须结构完整，要么成对出现，要么自结束标签。
  4. HTML标签可以嵌套，不能交叉嵌套。
  5. HTML标签中的属性必须有值，且必须加引号。

内联框架（用得不多）

一个页面引入另一个外部页面

属性：

  1. src：只想一个外面页面的相对路径

现实开发中不推荐使用，因为内联框架中网页，搜索引擎不会搜

  1. width：
  2. height：
  3. name：可以为内联框架制定一个name属性，通过该名字使用超链接标签时，可以将跳转页面显示在内联框架中。

超链接

使用超链接可以一个页面跳转到另一个页面

代码：

百度一下

  1. href: 指向连接跳转的目标地址，可以写一个相对路径也可以写一个绝对路径。

  2. 默认访问过的连接和没有访问过的连接，颜色有区别。

  3. 如果href值设置为#,连接会回到顶部，设置为#id值，就回到那。

    回到底部

回到顶部

  4. 联系我们，自动打开发送邮件应用程序。

    设置href值为mailto:邮件地址

    联系我们

    没有邮件应用程序，就不会打开，有会自动填充发送人邮箱地址。

  5. target： 设置在哪里打开连接（默认值为_self)

    ​ _blan: 在新页面中打开连接。

    ​ _self: 在当前窗口中打开。

居中标签

我会居中显示哦

center内容居中，不赞成使用，表现形式的最后都使用css来实现。

ID属性

所有标签都可以使用id属性，用于标志标签，id不能数字开头，不能重复。

使用如:

​ 超链接回到底部。

云服务器 GPU云服务器 学习html html学习 怎么学习html html代码学习

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/1674.html

相关文章

  • html前端学习-html前端学习怎么学习

    摘要：我们学习首先要学习的内容。倒不如从开始学习，掌握了普通的布局之后，再逐渐的学习的内容，使得样式的使用变得更加的流畅和灵活。有了一定的原生基础，可以选择这个前端框架来进行学习。相比而言，是前端三大语言中最简单的一个。htmlhtml作为一个超文本标记语言，拥有众多的标签可以使用。但是大量的前端初学者只会使用 div 和 span 这两个标签。这显然是有很大的问题的。所以，学习 html 的第一...

    番茄西红柿 评论0 收藏0

  • 学习笔记 | HTML 基本结构和基本标签 ——前端学习第一步！

    摘要：基本结构语言中，一个页面是由四个部分组成文档声明标签对标签对标签对图示文档声明这是一个文档声明，表示这是一个页面。标签标签表示页面内容的范围。 HTML HTML ...

    sPeng 评论0 收藏0

  • 前端之HTML学习

    摘要：对基础有个全面的印象因为以后的升级学习离不开基础作为支持。作为新生的你，需要学习的是究竟该要查询什么关键词。最后再啰嗦一句，学习编程语言一定要避免手懒，只看不敲。 HTML学习 请带着以下几个问题进行学习： 什么是HTML、HTML文档类型起到什么作用、HTML5和HTML4有哪些区别、pc端和移动端页面有什么区别、什么是块级元素什么是内联元素、块级元素和内联元素的区别、什么是H...

    lemanli 评论0 收藏0

  • 前端之HTML学习

    摘要：对基础有个全面的印象因为以后的升级学习离不开基础作为支持。作为新生的你，需要学习的是究竟该要查询什么关键词。最后再啰嗦一句，学习编程语言一定要避免手懒，只看不敲。 HTML学习 请带着以下几个问题进行学习： 什么是HTML、HTML文档类型起到什么作用、HTML5和HTML4有哪些区别、pc端和移动端页面有什么区别、什么是块级元素什么是内联元素、块级元素和内联元素的区别、什么是H...

    mudiyouyou 评论0 收藏0

  • 前端之HTML学习

    摘要：对基础有个全面的印象因为以后的升级学习离不开基础作为支持。作为新生的你，需要学习的是究竟该要查询什么关键词。最后再啰嗦一句，学习编程语言一定要避免手懒，只看不敲。 HTML学习 请带着以下几个问题进行学习： 什么是HTML、HTML文档类型起到什么作用、HTML5和HTML4有哪些区别、pc端和移动端页面有什么区别、什么是块级元素什么是内联元素、块级元素和内联元素的区别、什么是H...

    Gilbertat 评论0 收藏0

发表评论

登陆后可评论

0条评论

YPHP

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<