html学习基础

秒速五厘米 2022-09-02 08:43 111阅读 0赞

## 1.html5的简单介绍 ##

什么是HTML5？  
HTML5（H5）是HTML的下一代标准  
HTML产生于1990年  
HTML4产生于1997年  
HTML5产生于2008年正式发布  
HTML5于2012年，基本形成了比较稳定的版本

--------------------

## 2.html开发需要的环境 ##

Windows中使用的是Vscode,sublime,webstorm等

--------------------

# 3Httpd服务器 #

部署写好的html页面，来让用户访问  
云服务器-安装-Apache-部署  
Browser/Server  
用户只需要安装一款主流浏览器，即可访问很多的服务  
用户-电脑+手机-浏览器-网页-Server-数据库服务器  
HTTP协议   超文本传输协议   
URL 统一资源定位符

## 4html的文档类型 ##

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        
    </body>
    </html>

<!DOCTYPE html>:申明文档的类型为html

html标签：代表根标签，用来包含HTML中所有的元素

head标签：通常放一些配置文件，比如引入css或者jQuery等配置文件

body标签：是文档内容的在网页上的显示区

--------------------

## 5HTML元素和标签 ##

HTML元素：严格意义上来讲，HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。

HTML标签：是HTML的最基本组成单位，成对出现，大小写不敏感，h4推荐使用小写

--------------------

> <div><p>中国最棒</p></div>

块级元素：独占一行，用来导航，列表，菜单等

<div>大家好</div>
    <p>hello</p>
    <div><p>world</p></div>

div标签中能嵌套p标签，但是p标签中不能嵌套div

行内元素：与其他行内元素做一行空间

空元素：没有内容的元素 空元素是在开始标签中结束的 不建议直接使用

## 6属性 ##

元素的属性一般在开始标签里 属性由键值对组成

> <div id="myDiv" class="myDivClass"></div>

核心属性：

> <p id="p1">id属性</p>

id属性只能唯一对应

class

> <p class="p1">class属性</p>

一个class可以对应多个

style等

## 7注释 ##

## 8列表 ##

**有序列表**

start属性代表当前序列从什么时候开始，默认从1开始

reversed代表序列反着来

**无序列表**

**自定义列表**

## 9超链接 ##

超链接可以被用作跳转，

a标签：绑定目标与元素的id值   实现锚点跳转

<a href="https://baidu.com">百度一下</a> <br/>
                    <a href="mailto:用户@xxx.com" target="_blank">联系我</a>
                    <p>绑定目标与元素的id值   实现锚点跳转</p>
                    <a href="#header">返回顶部</a>

href="mailto:用户@xxx.com"可以用来发邮件给用户@xxx.com

target="\_blank":代表点击链接在新的页面打开

## 10图片 ##

src:图片的地址，必填

alt:当图片不能显示时页面所提示的文字