HTML基础--基本概念、结构、标签、样式

本文介绍了HTML的基础知识,包括网页概述、HTML基本结构和常见标签。讨论了HTML的文本标签,如标题、段落、水平线、换行,以及图像标签和路径。还提到了HTML5中新增和移除的元素,强调了样式设置的重要性。
摘要由CSDN通过智能技术生成

目录

网页概述     

HTML、CSS、JavaScript简介

常见浏览器及其内核

HTML基本结构

常见标签

文本标签

标题标签

段落标签

水平线标签

换行标签

文本样式标签

文本格式化标签

文本语义标签

time标签

mark标签

cite标签

特殊字符标签

图像标签

常见图像格式

图像标签

路径

绝对路径

相对路径

样式

定义

HTML5中已移除的元素

HTML5中新增加的元素


网页概述     

        网页概念:承载各种网站应用和信息的容器,所有可视化的内容都会通过网页展示给用户。

        网页组成:文字、图像、超链接元素、音频、视频、动画等。

        静态网页:页面信息固定,除非修改网页源代码。优点:访问速度快;缺点:更新不方便。

        动态网页:显示的内容随着用户操作和时间的不同而变化。优点:互动性好,可以实时更新数据;缺点:访问速度慢,安全性隐患大。

        动静结合:进行网站建设时,将重要的不需要更新更改内容做成静态网页,将需要数据更新和调用的内容做成动态网页

        web标准:

                结构标准:整理和分类网页元素(主要包括HTML、XML、XHTML)-->毛坯房

                表现标准:设置网页元素的外观样式(主要指CSS)-->外观装修

                行为标准:定义和编写网页模型(主要包括DOM、ECMAScrip)-->内部设备增添

HTML、CSS、JavaScript简介

        HTML:描述网页中的文本、图片、声音等内容-->机器人框架

        CSS:设置HTML文本内容、图片外形、版面布局等外观显示样式-->机器人外形

        JavaScript:网页脚本语言-->机器人运行程序

常见浏览器及其内核

        Mozilla Firefox:Gecko

        IE:Trident

        Safari:Webkit

        Opera:Presto-->Blink

        Google Chrome:Webkit-->Blink

HTML基本结构

使用软件:vs code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网页标题</title>
</head>
<body>
    可见的页面内容
</body>
</html>

 注:<!DOCTYPE html>  -->表示当前的网页支持html5标准

        <html lang="en"> -->语言为英文

        <meta charset="UTF-8">  -->指定页面的编码格式(字符集)

        <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->自适应终端的窗口

常见标签

文本标签

标题标签

格式:<hn>文本</hn>

    <h1>文本</h1>
    <h2>文本</h2>
    <h3>文本</h3>
    <h4>文本</h4>
    <h5>文本</h5>
    <h6>文本</h6>

网页渲染效果:

 特点:

        n的取值在1~6之间,数字越大字体越小

        效果为字体加粗 

        可以自动换行,浏览器会自动在标题标签前后添加空行

段落标签

格式:<p align="对齐方式">文本</p>

    <p>
        文本1
    </p>
    <p>
        文本2
    </p>

网页渲染效果:

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值