初学HTML 第一天

学习HTML主要学习标签。

ctrl+c复制  ctrl+v粘贴  ctrl+s保存 ctrl+a全选

windows+d返回主界面    windows+e打开计算机

前端包括PC端和移动端

网页的组成:文字,图片,按钮,输入框,视频。。

web标准:制作网页的规范   web(World Wide Web)即全球广域网,也称为万维网

web标准:

    1.结构标准  html

    2.表现标准  css  美化网页

    3.行为标准  js  网页对用户操作的属性

浏览器与服务器之间的关系

windows自带iis服务器软件

HTML Hyper Text Markup Language超文本标记语言

    超文本:在网页中能够实现页面跳转的文本【超链接标签】

    标记:在网页中显示的标签【在网页中做记号】

结构:

<!DOCTYPE html>    【指定文档类型为html类型,如果没有浏览器将按照自得的方式渲染,我们成为怪异类型】

<html>    【跟标签】

    <head>

            <title>网页标题</title>

    </head>

    <body>

            在浏览器中看到的所有网页信息

    </body>

</html>

结构中标签的分类:

    单标签:标签只有开始没有结束 如<link>,<hr>

    双标签:标签又开始有结束 如<head></head> <body></body>

ctrl+shift+d复制粘贴一行信息

单击要修改的地方的后面  按住ctrl再点击其他地方,删除修改  就会修改成相同内容

标签关系分类:

    嵌套关系(父子关系 后代关系)

    并列关系(兄弟关系)

文件后缀名决定打开方式

单标签(标记)

    注释标签<!--注释标签-->  ctrl+/

    换行标签<br>  横线标签<hr>

h1-h6

双标签(标记)

h1-h6标签

美国拉斯维加斯附近发生地震

美国拉斯维加斯附近发生地震

美国拉斯维加斯附近发生地震

美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震
美国拉斯维加斯附近发生地震

从语义化角度考虑一个网页中一号标题最好出现一次

段落标签

    <p></p>

表示强调标签

    <font></font>文本标签  规定文本的尺寸、字体和颜色

            color:改变文字颜色属性

            size:改变文字大小属性  

   <strong></strong>或者<b></b>文本加粗显示

    <em></em>或者<i></i>文字斜体显示

    <ins></ins>或者<u></u>下划线标签

    <del></del>或者<s></s>删除线

没有语义的标签

    <div></div>实现网页布局

    <span></span>在网页布局过程中使用     div标签需要独占一行,div标签可以包含任何标签

多媒体标签

        图片标签<img>

            属性:src:设置一个要显示的图片路径

                       title:设置鼠标悬停到图片上的文字提示

                        alt: 对图片的描述信息,为搜索引擎提供服务

                        width:高度  height:高度     如果只设置一个属性会自动调整

路径

    绝对路径  1带有磁盘的路径 2带有具体网址

    相对路径

            1.如果资源文件(img)和当前文件(html)在同一个文件夹中,src="图片名称"

            2.如果页面在图片的上一级目录中,src="图片所在文件名 / 图片名称"

            3.如果页面在图片的下一级目录中,src="../ 图片名称"

                    注意:一个../代表返回一级

超链接

    <a href=""></a> 跳转页面

           href="#"不跳转任何界面

            属性:  title:设置鼠标悬停到超链接上的文字提示

                       target:self 默认值在当前页面中打开新页面

                                   _blank 在新窗口中打开页面

                                    <base> 页面上的所有连接修改打开方式,如<base target="_blank"> 在head标签里面添加

锚链接  :属于超链接的另一种用法 。实现的是本页面内部的跳转                                

                如:<div id="某值"></div>  

                        <a href="#x某值"></a>

HTML版本介绍

    过渡版本Transitional  可以包含所有的html元素和属性

    严格版strict 可以包含所有html元素或者属性,但是不包含已经被废弃的标签,如font,b,i和属性align

html5标签

<!--导航标签-->
<nav></nav>
<!-- 区域 -->
<section></section>                    有语义的标签
<!-- 底部 -->
<footer></footer>                        注意:以上标签与div的用法一样,只是具有一定的语义
<!-- 侧边栏 -->
<aside></aside>
<!-- 文章 -->
<article></article>

视频标签

            video

              <video src="movie.mp4" controls autoplay loop>  </video>

                controls显示控制面板  autoplay自动播放  loop循环,不能指定循环次数

多种视频格式,只要有一个格式正确就可以打开

        <video controls>

                <source src="movie.mp4">

                <source src="movie.mp3">

                 <source src="movie.rmvb">

        </video>

音频

    audio

        <audio src="music.mp3" controls autoplay loop>



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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值