网站页面源码,前端页面的最基本组成形式,网页到底是什么? 网站开发教程...

演示网站:gofly.v1kf.com

-----------
【视频原文案】:
现在给大家介绍一下网站上的页面到底是什么。对于我们很多的普通用户来说,他可能不知道一个网站一个页面到底是什么东西。我们来从最基本的开始:如果想新建一个页面,他其实是你右键在你的文档里新建一个文本文档。那你的这个文本文档随便取个名字,它的后缀是txt。我们把它的后缀改成html。这样创建的一个它就是一个页面。然后我们用记事本打开,用记事本打开什么都没有,是吧?什么都没有,随便填点东西然后保存。保存的时候一定要看一下右下角是不是UTF-8。保存文件都要用UTF-8的编码。所以看右下角是UTF-8,如果不是的话点一下这个文件另存为这个地方编码,看一下是不是ASCII或者是UTF-8。这都不是,应该选这个UTF-8保存。它是有UTF-8就行了。打个中文,如果你不是UTF-8,它有时候会乱码。这个时候它就是一个页面。双击浏览器能打开,是不是?它就是个页面。我们在网站上看到的所有的东西就是看到的这个东西,这个叫HTML页面。
然后里面呢,我们如果想要展示一些内容,那就要写一些东西。那写的东西叫HTML的标签。标签是什么呢?就叫这个东西HTML。那么看这里一个是
,一个是
,一个是
,那这里一个就是一个闭合标签。他两个是中间包着的,就是我们的主要内容。这个就是HTML的标签,是一对存在的一对。然后后面这个是用这个斜杠,然后我们里面如果想展示成一个标题,那个标签呢叫

也是个标签,从这边写,它是一个标题。那看一下刷新,是不是很大?因为它是
的这个标题,它的这个权重是最大的,它的这个尺寸也是最大的。这个就是我们的HTML。我们在网站上看到的东西就是这个东西。
然后如果我们哎想要实现一些个特效,网站上不能一个干瘪的一个文字是吧?他有时候会有很多的特效,比如说跳转啊或者是有个图片那动来动去啊,这些都属于特效。那我们需要了解这个东西叫JS。他在这个标签里存在的叫。那这个就是JS的一个标签,标签里边写什么呢?可以写一个随便写一个alert,alert就是警告,警告就是弹出一个提示框。我们刷新一下,是不是弹了个提示框?这个就是JS,我们的JS的一个代码。
这就是一个最基本的一个页面。当然页面上很多时候还会有一个样式,什么是样式?就是给这个文本加一些个它的颜色大小,靠左靠右这些就属于是样式。那个样式呢叫做CSS。叫CSS,在这里面呢需要先写上,用写上标签把它给包起来。写上标签然后里边写样式,样式呢就是h1,这个就是让我们所有的
标签让它怎么样?一个大括号里面写一些样式,写什么color,颜色变成红色。颜色变成红色,刷新一下,这个没有渲染出来。你看一下没有渲染出来,style写错了是吧?style,刷新一下,啊变成红色了。
这个就是我们一个页面的一个基本组成,一个就是HTML,一个是CSS,还有一个是JS。JS哎,我们所有的网站上东西都是由这个东西来组成的。我们随便打开一个网站,比如说这个网站是吧?这个网站怎么看它的页面源代码呢?看右键,右键查看页面源代码,就所有就可以看到它的所有的HTML的源码。那它也是HTML包括的,然后有那个script,script里面就是JS嘛。然后有style,当然它的样式是用一个外链的形式练进来的。我们是写在行内的,这个是无所谓的。你只要只需要知道一个页面上有三个主要组成部分,一个HTML,一个CSS和一个JS就可以了。
-----------
-----------
视频总结:
【🎞 -> 挑重点:该视频核心内容总结:】
1. 页面基础:新建HTML页面
2. HTML标签:定义页面结构
3. JS与CSS:增强页面功能和样式
------------------------
【🛠 -> 该视频在个人和公司的落地应用:】
1. 个人:学会HTML基本标签,快速搭建个人博客或简历页面。
2. 公司:利用JS和CSS提升网站交互性和用户体验,如在线客服弹窗或动态菜单。
3. 场景应用:使用HTML+CSS+JS制作动态网页广告,提高点击率和用户参与度。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/38360.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue3+ts+vite项目中使用spreadjs,通过script标签引入spreadjs可以提高打包速度

https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/quickstart/quickstart-js 右键另存这个官方的示例页面可以下载全部js文件 https://demo.grapecity.com.cn/SpreadJS/WebDesigner/index.html spread.html: <!DOCTYPE html> <html lang"zh">…

共识机制深度解析:PoW、PoS、DPoS和PBFT

区块链的世界里&#xff0c;有一个非常重要的概念叫做“共识机制”。它就像是区块链的心脏&#xff0c;保证大家在这条链上的信息是可靠的、不可篡改的。今天&#xff0c;我们就来通俗易懂地聊聊区块链里的四大共识机制&#xff1a;工作量证明&#xff08;PoW&#xff09;、权益…

数据产品经理知识库构建

概述 数据产品经理是企业中负责管理和推动数据产品的专业人员。他们利用数据来辅助决策&#xff0c;优化产品&#xff0c;提升用户体验。用STAR法则&#xff08;Situation, Task, Action, Result&#xff09;来介绍数据产品经理的角色&#xff0c;应该学习的数据产品&#…

Rust-11-错误处理

Rust 将错误分为两大类&#xff1a;可恢复的&#xff08;recoverable&#xff09;和 不可恢复的&#xff08;unrecoverable&#xff09;错误。对于一个可恢复的错误&#xff0c;比如文件未找到的错误&#xff0c;我们很可能只想向用户报告问题并重试操作。不可恢复的错误总是 b…

Labview_网络流

网络流的介绍 网络流是一种易于配置、紧密集成的动态通信方法&#xff0c;用于将数据从一个应用程序传输到另一个应用程序&#xff0c;其吞吐量和延迟特性可与 TCP 相媲美。但是&#xff0c;与 TCP 不同的是&#xff0c;网络流直接支持任意数据类型的传输&#xff0c;而无需先…

Java虚拟机调优技巧及性能监控

Java虚拟机调优技巧及性能监控 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01; 引言 Java虚拟机&#xff08;JVM&#xff09;作为Java程序的核心执行环境&…

忙忙碌碌的混沌之中差点扑了个空而错过年中这条线

文章目录 前言初见端倪混沌初始力不从心心力交瘁拾遗补缺总结 前言 突然意识到过完这个周末已经7月份了&#xff0c;他预示着我的2024年已经过半了&#xff0c;过年回家仿佛还是昨天的事情&#xff0c;怎么转眼间已经到了年中了。心里还是不愿承认这件事&#xff0c;翻开自己2…

cpu,缓存,辅存,主存之间的关系及特点

关系图 示意图&#xff1a; ------------------- | CPU | | ------------- | | | 寄存器 | | | ------------- | | | L1缓存 | | | ------------- | | | L2缓存 | | | ------------- | | | L3缓存 | | | ------------- | ----…

每日一题——Python实现PAT乙级1073 多选题常见计分法(举一反三+思想解读+逐步优化)9千字好文

一个认为一切根源都是“自己不够强”的INTJ 个人主页&#xff1a;用哲学编程-CSDN博客专栏&#xff1a;每日一题——举一反三Python编程学习Python内置函数 Python-3.12.0文档解读 目录 初次尝试 再次尝试 有何不同 版本一&#xff08;原始版本&#xff09;&#xff1a;…

ISO 19110全局要求类中的/req/global/binding-constraints详细解释

/req/global/binding-constraints 要求: 如果模型中包含对绑定实体的约束&#xff0c;则这些约束必须由一个具有字符串值的描述属性的约束实体&#xff08;Constraints entity&#xff09;表示。绑定实体必须通过“constrainedBy”角色链接到这个约束实体。 具体解释 定义 …

修复vcruntime140.dll方法分享

修复vcruntime140.dll方法分享 最近在破解typora的时候出现了缺失vcruntime140.dll文件的报错导致软件启动失败。所以找了一番资料发现都不是很方便的处理&#xff0c;甚至有的dll处理工具还需要花钱&#xff1f;&#xff1f;&#xff1f;&#xff1f;&#xff0c;我本来就是为…

python实现网页自动化(自动登录需要验证的网页)

引言: python作为实现网页自动化的一个重要工具,其强大的各种封装的库使得程序运行更加简洁,只需要下载相应的库,然后调用库中的函数就可以简便的实现我们想要的网页相关操作。 正文: 我的前几篇文章写了关于初学爬虫中比较容易上手的功能,例如爬取静态网页的数据、动…

ThreadPoolExecutor 工作线程Worker自身锁设计

个人博客 ThreadPoolExecutor 工作线程Worker自身锁设计 | iwts’s blog 总集 想要完整了解下ThreadPoolExecutor&#xff1f;可以参考&#xff1a; 基于源码详解ThreadPoolExecutor实现原理 | iwts’s blog Worker-工作线程管理 线程池设计了内部类Worker&#xff0c;主…

【python】python知名品牌调查问卷数据分析可视化(源码+调查数据表)【独一无二】

&#x1f449;博__主&#x1f448;&#xff1a;米码收割机 &#x1f449;技__能&#x1f448;&#xff1a;C/Python语言 &#x1f449;公众号&#x1f448;&#xff1a;测试开发自动化【获取源码商业合作】 &#x1f449;荣__誉&#x1f448;&#xff1a;阿里云博客专家博主、5…

CleanShot X - 超好用苹果电脑截图录屏工具

Mac 自带的截图工具十分鸡肋&#xff0c;不仅功能少&#xff0c;无法长截图外&#xff0c;也不支持 GIF 制作&#xff0c;很难满足日常做图需求。 CleanShot X 是一款 Mac 平台近乎无可挑剔的专业截图录屏工具 &#xff0c;能完美代替 Mac 自带截图。它提供超过 50 项功能&…

嵌入式学习——硬件(s3c2440外部中断、定时器中断)——day54

1. start.s preserve8area reset, code, readonlycode32entryldr pc, startnopnopnopnopnop ldr pc, interrupt_handlernopstartldr sp, 0x40001000mrs r0, cpsrbic r0, r0, #0x1Forr r0, r0, #0x12;IRQbic r0, r0, #(1 << 7);打开IRQ中断允许msr cpsr_c, r0ldr …

【ARM CoreLink 系列 7.1 -- TZC-400 控制器 programmers model】

请阅读【ARM CoreLink 文章专栏导读】 文章目录 TZC-400 programmers modelBuild configuration registerAction registerGate keeper registerSpeculation control registerInterrupt status registerTZC-400 programmers model ARM TZC-400(TrustZone地址空间控制器)是一种…

Nacos配置中心客户端源码分析(一): 客户端如何初始化配置

本文收录于专栏 Nacos 推荐阅读&#xff1a;Nacos 架构 & 原理 文章目录 前言一、NacosConfigBeanDefinitionRegistrar二、NacosPropertySourcePostProcessor三、AbstractNacosPropertySourceBuilder总结「AI生成」 前言 专栏前几篇文章主要讲了Nacos作为服务注册中心相关…

zram压缩机制看swapon系统调用

1.swapon开启zram交换分区 swapon /dev/block/zram0 mkswap /dev/block/zram0 上面命令调用了linux的swapon系统调用启动zram0交换分区;mkswap命令向块设备文件/dev/block/zram0写入了swap_header信息 问题:实际安卓平台是哪里触发swapon和mkswap调用的,我们已MTK8195平台…

平衡三进制类脑计算

PS:用来记录一些新奇又有趣的想法。。。 1、量子的世界 1.1薛定谔的猫 这感觉是个有趣的话题。 在宏观中可以观测到的&#xff0c;是稳定的两种状态&#xff0c;但随着尺寸不断缩小&#xff0c;直至达到微观尺度&#xff0c;这一切都变的有趣了起来&#xff0c;一只“既死又活…