首页 > 其他分享 >第一章网页的基础知识

第一章网页的基础知识

时间:2024-09-12 21:54:31浏览次数:12  
标签:网页 1.2 网站 标签 第一章 HTML 文档 基础知识

1.1认识网页网站

1.1.1认识网站和网页及常用术语

网页:是构成网站的基本元素,包含文字、图片、链接、多媒体等各种信息,可以展示丰富的内容,用户通过在浏览器中输入网址来访问特定的网页,从而获取信息。

网站:‌‌是指在互联网上,根据一定的规则,使用 HTML(超文本标记语言)等工具制作的相关网页的集合。

常用术语:

url(统一资源定位符):用于标识互联网上资源的地址。

域名:是互联网上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位。

ftp(文件传输协议):用于在网络上进行文件传输的标准协议。

超链接:从一个网页指向另一个目标的连接关系

1.1.1网页和网站的区别

网页是网站的组成部分,网站是由多个网页组成的集合体,通过链接相互连接,形成一个整体。通常,网站还包括‌导航菜单、菜单、‌底部信息等共享的元素

1.1.2网页和网站的联系

网站是由多个网页组成的,每个网页都是网站的一部分。

1.1.3静态网页和动态网页的区别

静态网页是只有html css

动态网页只要有JavaScript就是动态网页

1.2网页的基本构成元素

1.2.1.文本

体积小 传输快

1.2.2.图片和动画

生动

1.2.3.超链接

可从一个位置到另一个位置

1.2.4.音频和视频

使网页多样化

1.2.5.交互表单

可收集用户信息


1.2.6.其他常见元素

 可使页面活泼


1.3 页面布局结构 


1.3.1 网页页面布局


1.3.2 网页色彩搭配

rgb 三元色

每一个网站都有自己的主色调


1.4    Web前端技术简介


1.4.1 初识WEB前端

是基于互联网的、通过超链接将多个文档等资源连接起来形成的信息系统,方便人们浏览、共享和交互信息


1.4.2 WEB前端开发的三大核心技术

HTML:设计页面结构 决定是用文字 图片

CSS:页面样式文件,决定加粗或居中

JavaScript :是一种前端编程语言、动态技术,用于为网页添加动态交互功能,如表单验证、页面特效、动画等,也可用于服务器端开发(Node.js)等多种场景


1.4.3 前端开发工具

1.浏览器

2.网页编辑器

3.切图软件

1.5 HTML语法基础

1.5.1 HTML概述

1.语言

2.超文本

3.标记

1.5.2HML基本结构

1.HTML文档标签<html>...</html>

标记范围,超出标签之外的内容不出现在页面上

2. HTML文档头标签<head>...</head>

定义HIML文档。

3.文档编码

4.HTML文档主体标签<body>...</body>

主体部分

1.6创建HTML文档

1.7网页头部标签

1.7.1<title>标签

设置标题

1.7.2<meta>标签

1.keywords

设置关键字

2.description

描述页面面内容

1.7.3 <link>标签

样式脚本

1.7.4 <script>标签

指定文件路径、类型

1.8  HTML5文档注释和特殊符号

1.8.1 注释

ctrl+/

1.8.2 特殊符号

空格 、<、>、"、©

实践代码

<!DOCTYPE html>
<html><!-- 告诉内容范围 -->
	<head>
		<meta charset="utf-8" /> <!--字符集-->
		<meta name ="keyword"content="xxx"/><!-- 关键词 -->
		<meta name ="description"content="xxx"/><!-- /*描述网页内容*/ -->
		<title>第一个网页项目</title><!-- 设置标题 -->
		<link rel="stylesheet" href="css/index.css" type="text/css"/><!-- css样式脚本 指定路径 文件类型 -->
		<script src="js/index.js" type="text/javascript"></script><!-- javascript指定文件路径 类型 -->
	</head>
	<body>
		<!-- /*主体部分*/ -->
		<p>这是我的第一个网页项目</p>
		<p>2023级</p>
		<a href ="http://www.baidu.com">百度一下</a>
	</body>
</html>
<!-- /*控制页面内容*/ -->

实践效果

1.9 综合案例——临江仙 · 送钱穆父

标签:网页,1.2,网站,标签,第一章,HTML,文档,基础知识
From: https://blog.csdn.net/2401_86933352/article/details/142092784

相关文章

  • 1765asp.net古镇旅游网站VS开发sqlserver数据库web结构c#编程web网页设计
    博主介绍:专注于Java.net phpphython 小程序等诸多技术领域和毕业项目实战、企业信息化系统建设,从业十五余年开发设计教学工作☆☆☆精彩专栏推荐订阅☆☆☆☆☆不然下次找不到哟我的博客空间发布了1000+毕设题目方便大家学习使用感兴趣的可以先收藏起来,还有大家在......
  • C++入门基础知识64——【关于 C+++数据抽象】
    成长路上不孤单......
  • 手把手教你制作最简网页版倒计时程序(核心代码仅25行)
    一、解构如图所示,手机浏览器的效果。代码就是简单的html语言加上一个JavaScript脚本,界面主要分3部分,功能实现主要分3个函数。(一)显示样式在头里定义了居中显示的CSS样式,将来在浏览器中居中显示倒计时X分XX秒。<styletype="text/css">   .center{      positio......
  • CTF密码学基础知识整理
    一.常见编码转换(1)整数转ascii码INT->CHAR:chr(97)CHAR->INT:ord('a')(2)hex转ASCII>>>importbinascii>>>binascii.a2b_hex('666c6167')b'flag'>>>binascii.b2a_hex(b'flag')b'666c6167&......
  • 通过LiveGBS实现安防监控摄像头GB28181转成WebRTC流实现web浏览器网页无插件低延迟直
    @目录1、WebRTC超低延时直播2、WebRTC延时对比3、LiveGBS的低延时的WebRTC流4、分屏页面如何选择默认播放流5、无法播放Webrtc6、搭建GB28181视频直播平台1、WebRTC超低延时直播需要低延时的视频流监控播放,之前可以用rtmp的低延时播放(1秒左右),随着浏览器对rtmp的禁用,无插件的低延......
  • 视频监控推流助手/极低延迟/支持N路批量多线程推流/264和265推流/监控转网页
    一、前言说明搞视频监控开发除了基本的拉流以外,还有个需求是推流,需要将拉到的流重新推流到流媒体服务器,让流媒体服务做转发和负载均衡,这样其他地方只需要问流媒体服务器要视频流即可。为什么拉了又重新推呢,因为软件这边和可能拉流后做了处理,比如做了人工智能运算,识别到了物体方框......
  • Chainlit集成Langchain并使用通义千问和智谱AI实现AI知识库检索网页对话应用
    LangChain简介LangChain是一个开源框架,设计用于开发和部署与语言模型(如大型语言模型LLM)交互的应用程序。它提供了一种简便的方法来构建基于自然语言处理(NLP)的系统,这些系统可以执行各种任务,例如问答、文本生成、文档检索等。LangChain的主要目标是简化开发过程,使开发者能......
  • 【编程基础知识】mysql中的insert into ... on DUPLICATE key和replace into的性能对
    一、概述在MySQL中,INSERTINTO...ONDUPLICATEKEYUPDATE和REPLACEINTO都是用来处理插入或更新数据的语句,但它们在性能和行为上有所不同。二、REPLACEINTOREPLACEINTO语句在遇到唯一键或主键冲突时,会先删除旧记录,然后插入新记录。这意味着它会执行两次操作:删除......
  • 最新PHP在线客服系统I聊天源码网页端在线客服系统 带教程
    安装教程1.上传源码压缩包到网站目录并解压2.设置网站运行目录public(防跨站不要勾选)3.设置伪静态,选择thinkphp4.进入网站目录,打开终端 输入启动命令5.宝塔配置开启1238和2346端口后台登录地址:https://域名/admin详细教程查看压缩包中的安装说明.doc文档效果展示......
  • html+css网页设计 旅游 雪花旅行社5个页面
    html+css网页设计旅游雪花旅行社5个页面网页作品代码简单,可使用任意HTML辑软件(如:Dreamweaver、HBuilder、Vscode、Sublime、Webstorm、Text、Notepad++等任意html编辑软件进行运行及修改编辑等操作)。获取源码1,访问该网站https://download.csdn.net/download/qq_42......