博客
关于我
HTML基础(一)
阅读量:204 次
发布时间:2019-02-28

本文共 1060 字,大约阅读时间需要 3 分钟。

文章目录

理解网页文件

  1. 每一个网页对应一个网页文件。
  2. 在浏览器中看到的网页实质为:网页文件
  3. 网页文件:
    文本文件;
    扩展名:.html或.htm
    文件内容为:HTML代码和文本内容

HTML简介

  1. 超文本标记语言
  2. HTML不是一种编程语言,而是一种标记语言
  3. 标记语言是一套标记标签,HTML使用标记标签来描述网页。
  4. HTML 标记标签通常被称为HTML标签,它是由尖括号包围的关键词
  5. HTML标签三要点:
    (1)词汇(标签)
    (2)语法(标签的使用规定)
    (3)语义(浏览器“理解”的标签含义)

HTML基本结构

HTML基本结构(所有网页必须有的):文档的声明开始标签(所有的内容,一个网页文件,只有一对html标签)    头部        xxx        
设置编码方式等 文件的体部 结束标签

在这里插入图片描述

标签

  1. 双标签:由“开始标签”和“结束标签”两部分构成。结束标签比开始标签多了一个“/”(比如<body></body>),必须成对使用。
  2. 单标签:在开始标签中进行关闭,即以开始标签的结束而结束(比如<meta/>)。
  3. 双标签:代表标签作用范围
    单标签:无需表达范围,仅在标签出现处有效(不用限定范围)
    所有标签必须全部闭合/。
  4. <br/>作用:换行。

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

  1. 网页元素 是指构成网页的各项内容(列表、超链接、文字、图片)
  2. 标题:<h1>...</h1> h1-h6 h1表示1级标题,可以同时有多个h1标题。
  3. 段落<p>...</p>
  4. 图片标签
    在这里插入图片描述
    src:指明存储图像的位置(图片的路径)
    alt:为图片添加替换文本(当找不到指定图片时,会显示alt中的话)
    (1)绝对路径:
    本机绝对路径:即从盘符开始的完整路径
    网络绝对路径:网络可访问的地址。
    优点:真实路径、定位清晰
    缺点:本机绝对路径长,容易出错;如果站点文件夹被移动,就需要重新修改路径
    (2)相对路径:
    图片和网页在同一级: src = "./图片名"
    图片在网页的下一级目录src = "目录名称/图片名"
    图片在网页的上一级目录src = "../图片名"
    优点:文件夹被移动,其内部文件的相对路径不变

注意事项:

不要使用本机绝对路径,推荐使用相对路径
图片文件单独存放在一个文件夹中
图片文件夹与页面文件放在同一个目录下

超链接

在这里插入图片描述

列表标签和内联框架

列表

  1. HTML支持无序列表、有序列表。(有无前后顺序的信息列表)
  2. 一对标签
    无序列表:
    在这里插入图片描述

有序列表:

在这里插入图片描述

效果:

在这里插入图片描述

内联框架

  1. 用于在网页内显示另一个网页文件。

在这里插入图片描述

示例主要代码及效果

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

转载地址:http://ujwc.baihongyu.com/

你可能感兴趣的文章
Netgear wndr3700v2 路由器刷OpenWrt打造全能服务器(十一)备份
查看>>
netlink2.6.32内核实现源码
查看>>
netmiko 自动判断设备类型python_Python netmiko模块的使用
查看>>
NetMizer 日志管理系统 多处前台RCE漏洞复现
查看>>
NetMizer-日志管理系统 dologin.php SQL注入漏洞复现(XVE-2024-37672)
查看>>
Netpas:不一样的SD-WAN+ 保障网络通讯品质
查看>>
netron工具简单使用
查看>>
NetScaler MPX Gateway Configuration
查看>>
NetScaler的常用配置
查看>>
netsh advfirewall
查看>>
NETSH WINSOCK RESET这条命令的含义和作用?
查看>>
netstat kill
查看>>
netstat命令用法详解
查看>>
Netstat端口占用情况
查看>>
Netty 4的内存管理:sun.misc.Unsafe
查看>>
Netty channelRegistered\ChannelActive---源码分析
查看>>
Netty NIO transport && OIO transport
查看>>
netty php,netty
查看>>
Netty WebSocket客户端
查看>>
netty 主要组件+黏包半包+rpc框架+源码透析
查看>>