认识网页

问题1：网页由哪些部分构成？

文字、图片、音频、视频、超链接

问题2：我们看到的网页背后本质是什么？

前端程序员写的代码

问题3：前端的代码是通过什么软件转换成用户眼中的页面？

通过浏览器转化（解析和渲染）成用户看到的网页

常见五大浏览器

IE浏览器、火狐浏览器、谷歌浏览器、苹果电脑（Safari浏览器、（欧朋）Opera浏览器）

浏览器市场份额

谷歌占比最大

浏览器渲染通过浏览器内核（渲染引擎）

渲染引擎不同，导致解析相同代码时的速度、性能、效果也不同的

什么是Web标准？

三个构成：html（结构），css（表现），JavaScript（行为）

HTML骨架结构由哪些标签组成？

html标签：网页的整体

head标签：网页的头部

body标签：网页的身体

title标签：网页的标题

开发工具：Visual Studio Code、Webstorm、Sublime、Dreamweaver、Hbuilder

快捷键：Vs Code中    Ctrl+/  注释

HTML标签与标签之间的关系可分为：

父子关系（嵌套关系）

<head>

　　<title></title>

</head>

兄弟关系（并列关系）

<head></head>

<body></body>

快捷键： Ctrl+D 选中一个内容按ctrl+d可以选中相同的内容

文本格式化标签介绍

场景： 需要让文字加粗、下划线、倾斜、删除线等效果

标签         说明　　　　　　　　标签  　　　　 说明

b　　　　加粗　　　　　　　  strong 　　　　加粗

u　　　　下划线　　　　　　　ins　　　　　下划线

i　　　　　倾斜　　　　　　　 em　　　　　倾斜

s　　　　删除线　　　　　　　del　　　　　删除线

语义：突出重要性的强调语境

路径分为：

绝对路径（了解）：指目录下的绝对位置，可直接到达目标位置，通常从盘符开始的路径（网址也叫绝对路径）

相对路径（常用）：

同级目录：当前文件和目标文件在同一目录中（./ ）

下级目录：目标在下级目录中(./文件夹名字/图)

上级目录：目标文件在上级目录中（../）

音频标签：

 <audio src="./music.mp3" controls></audio>
  属性名　　　　　　　　功能
　src　　　　　　　　音频的路径
controls　　　　　　显示播放的控件
autoplay 　　　　　自动播放（部分浏览器不支持）
loop　　　　　　　　循环播放
视频标签：
 <video src="./video.mp4"></video>
  属性名　　　　　　　　功能
　src　　　　　　　　视频的路径
controls　　　　　　显示播放的控件
autoplay 　　　　　自动播放（谷歌浏览器中需配合muted实现静音播放）
loop　　　　　　　　循环播放
链接标签
 <a href="https://www.baidu.com">跳转百度</a>
开发网站的初期，我们还不知到跳转地址的时候，href的值书写#
href: 跳转地址
target属性
属性值　　　　　　　　效果
_self　　　　　　　　默认值，在当前窗口中跳转（覆盖原网页）
_blank　　　　　　　在新窗口中跳转（保留原网页）
 

随机推荐

  1. 配置隐藏index.php

    .htaccess文件写入类容放到跟目录下就OK <IfModule mod_rewrite.c> Options +FollowSymlinks -Multiviews RewriteE ...

  2. Linux系统开机自启动jar包程序

    一.编写jenkins开机自启动脚本 vim /etc/rc.d/init.d/jenkins.sh #!/bin/bash export JAVA_HOME=/usr/lib/jvm/java ex ...

  3. 蓝牙mesh消息包与以太网帧的分层构成

    目录 笔者在接触以太网之前,先了解的是蓝牙mesh的各类信息.现翻看一本介绍TCP/IP协议的资料,发现应用层数据在以太网协议栈内的封装过程与蓝牙mesh协议栈内的封装过程异曲同工.下图左侧是手头这本 ...

  4. 创建异步倒计时触发Task

    https://www.cnblogs.com/shanfeng1000/p/13402152.html //Task关闭 CancellationTokenSource cancel = new C ...

  5. 激光雷达ldlidar communication is abnormal.

    查看串口设置是否正常,可以通过cat /dev/ttyS4查看是否有数据以确定所接的串口是否正确

  6. dcat-admin在弹框中使用grid的编辑框不提示也不报错

    显示效果 #版本:2.1.5-beta #点击编辑时没有反应,其实它已经把编辑框显示出来了,只是在当前这个弹框的后面,我们看不见,这样你可以在自己的项目中把弹框挪开或在F12中html搜索应该显示的代 ...

  7. js获取当天时间，凌晨0点

    凌晨0点 fields['startTime']=new Date(new Date(fields.searchTime2[0]).toLocaleDateString()).getTime() 当天 ...

  8. OS-lab3

    OS-lab3 lab2之后,我们能够通过MMU访问内存了,不过操作系统最重要的是能够让进程运行. include env.h 定义了进程控制相关的变量,如进程数量NENV.进程状态ENV_FREE等 ...

  9. flutter SafeArea和SliverSafeArea，适应特殊屏幕

    现如今的手机已经不能提供给应用程序规整的矩形界面了,一些带圆角或者是刘海屏让应用程序的布局更加复杂,甚至是需要单独适配,这对开发者来来太糟糕了. 因此SafeArea控件应用而生,SafeArea通过 ...

  10. VUE使用axios数据请求时报错 TypeError: Cannot set property 'xxxx' of undefined 的解决办法

    正常定义全局变量: data:function (){ return{ currentOrders:[] } }, 使用Axios发送请求并获取后端数据时,如果在then中使用this.current ...