HTML学习笔记3----制作一个简易网站
随笔记录方便自己和同路人查阅。
#------------------------------------------------我是可耻的分割线-------------------------------------------
有了从前面几课的基础,现在只需再花几分钟时间,你就能学会如何制作自己的第一个网站了。
#------------------------------------------------我是可耻的分割线-------------------------------------------
如何做呢?
首页新建一个记事本并把文件最后修改为html
然后呢?
先试着做一个显示如下内容的网页:“哇!这是我的第一个网站。”继续学习,就你就知道这是多么容易了。HTML 简单易学。 浏览器读 HTML 就跟你读书一样,也是从上往下,从左到右进行的 。 所
以,HTML 文档的开始和结束便对应于网页的头和尾。你首先要做的是告诉浏览器,你们将采用 HTML 语言来“对话”。这是通过 <html> 标签来实现的(这是容易理解的)。所以,在做所有其他事之前,先
在记事本的第一行敲入“ <html> ”。也许你记得前面课程中我们说过,这里的 <html> 是首标签,在HTML 文档结尾处必须有相应的尾标签与之对应。好的,为了防止最后忘记写这个尾标签,我们现在就输
入“ </html> ” , 然后在 <html> 和 </html> 之间留些空行,用于书写其余代码。
下面,我们需要为 HTML 文档写一个“头部(head)”,它提供关于当前文档的信息;然后写一个“主体(body ) ”,它提供文档的内容。HTML 最重要的就是简单——在这里,我们只需把头部( <head>
和 </head> )放到主体( <body> 和 </body> )的前面就行了。
如下面:

注意我们是如何用换行(用 Enter键)与缩进(用 Tab 键)令代码具有层次感的。理论上,你如何书写 HTML 文档,这无关紧要。但为了便于阅读代码,和保持良好的概貌,我们 强烈建议你采用换行与缩进来层次化
L HTML 代码,就像上面的例子一样。上面这个文档便构成了你的第一个网站——它只包含一个网页,而且内容很单调,可能与你的想象相去甚远,但在一定程度上它仍是一个网站。你可以将它用作其他 HTML 文档的基
本模版。
不错不错,但我如何添加更多内容?
前面我们学到过,HTML 文档有两个部分:头部(head)和主体(body )。 你在头部( head ) )提供关于网页的信息,你在主体( body )部分提供网页的具体内容。比如,如果你要指定 HTML 文档的网页标题
(title )(它将显示在浏览器窗口顶部),你就 要在头部(head)提供有关信息。用 title 元素来指定网页标题:即在首标签 <title> 与尾标签</title> 之间写上网页标题:

注意,网页标题(title)不是显示在网页里,而是显示在浏览器窗口的标题栏上的。网页里显示的所有内容都必须放在 body 元素里。比如,我们要在网页里显示“哇!这是我的第一个网站。”这行文字,它属于主体(body ) 部
分,所以我们在 body 元素里输入:

标签 <p> 里的 p 是“段落(paragraph)”的意思,也就是一个文本段落。现在,你的 HTML 文档应该是这样:

搞定! 你已经完成了自己第一个真正的网站(尽管它只包含一个网页)!
接着,你需要将它保存到你的硬盘上,然后在浏览器中打开它,就可以看到网站的效果了
HTML学习笔记3----制作一个简易网站的更多相关文章
- C#.NET学习笔记2---C#.第一个C#程序
C#.NET学习笔记2---C#.第一个C#程序 技术qq交流群:JavaDream:251572072 教程下载,在线交流:创梦IT社区:www.credream.com 6.第一个C#程序: ...
- 用XMLHttpRequest制作一个简易ajax
概述 jquery退出历史舞台之后,我们怎么来发送ajax请求呢?可以用相关的库,也可以自己制作一个简易的ajax. 需要说明的是,我们使用的是XMLHttpRequest 2,它几乎兼容所有主流浏览 ...
- express + mongodb 搭建一个简易网站 (四)
express + mongodb 搭建一个简易网站 (四) 目前网站整体页面都已经能全部展示了,但是,整个网站还有两个块需要做完才能算完整,一个连接数据库,目前网站上的数据都是抓取的本地假数据,所以 ...
- express + mongodb 搭建一个简易网站 (三)
express + mongodb 搭建一个简易网站 (三) 前面已经实现了基本的网站功能,现在我们就开始开搞一个完整的网站,现在整个网站的UI就是下面的这个样子. 我们网站的样子就照着这个来吧. 1 ...
- express + mongodb 搭建一个简易网站(二)
express + mongodb 搭建一个简易网站 (二) 在搭建网站(一)中,实现了简单的路由功能,这离一个完整的网站还差的有点远,继续撸代码吧. 1.首先在根目录下新建一个views文件夹,用来 ...
- express + mongodb 搭建一个简易网站(一)
express + mongodb 搭建一个简易网站(一) 前言:后台使用node.js的express框架,数据库使用mongodb,模板使用ejs.大概就这些. 开始第一个简易网站之旅吧.... ...
- Spark学习笔记1——第一个Spark程序:单词数统计
Spark学习笔记1--第一个Spark程序:单词数统计 笔记摘抄自 [美] Holden Karau 等著的<Spark快速大数据分析> 添加依赖 通过 Maven 添加 Spark-c ...
- Unity3D学习笔记2——绘制一个带纹理的面
目录 1. 概述 2. 详论 2.1. 网格(Mesh) 2.1.1. 顶点 2.1.2. 顶点索引 2.2. 材质(Material) 2.2.1. 创建材质 2.2.2. 使用材质 2.3. 光照 ...
- 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具
查看本章节 查看作业目录 需求说明: 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具 实现思路: 使用history对象中的 forward() 方法和 ...
- 使用jQuery制作一个简易的购物车结算流程
因为今天下午时候在网上买了东西,在结算界面的时候突发奇想的也想自己动手做一个结算界面,当然了,只是一个最简易的结算界面,有商品数量的加减,有单价和小计,单个多个删除,全选和区县全选等等一些小功能,我在 ...
随机推荐
- scrapy 爬取酷狗热门歌手音乐
目录 声明 Hello,酷狗! 创建一个Scrapy项目 spider模块 分析前端界面 注意 items模块 pipeline模块 处理音频文件自定义下载路径 自定义下载图片路径 异步存入到数据库 ...
- Intellij IDEA远程debug
1.服务器开启远程调试模式,增加JVM启动参数,以支持远程调试 服务器端的tomcat/bin/catalina.sh文件,在第一行添加参数配置如下(要确保下面的端口没有被占用).CATALINA_O ...
- cookie,session,token,drf-jwt
1.cookie,session,token发展史 引入:我们都知道 http 协议本身是一种无状态的协议,一个普通的http请求简单分为三步:客户端发送请求request服务端收到请求并进行处理服务 ...
- 西湖论剑2023-mp3[wp]
一 题目描述 二 解题步骤 1.分析文件 (1)放入Audacity中查看频谱信息无果 (2)010editor中查看文件结构 文件尾部存在PNG文件尾,搜索png文件头 将该png文件复制提取出来, ...
- JQUERY动态的修改<div>样式
首先需要引入JQUERY <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> & ...
- web开发(2): html标签/web语义化
chapter2 html 标签 在sublime中敲入!, 按tab 进行拓展,得到如下框架 <!DOCTYPE html> <html lang="en"&g ...
- React函数式组件值之useRef()和useImperativeHandle()
一.useRef useRef共有两种用法,获取子组件的实例(只有类组件可用),在函数组件中的一个全局变量,不会因为重复 render 重复申明, 类似于类组件的 this.xxx. 1. useRe ...
- 02.java基础(一)java的基础、方法和数组
目录 Java基础 Java特性 Java程序运行机制 Java基础语法 1.数据类型 基本类型 引用类型 数据类型扩展 String类型内存分配过程 转义字符 类型转换 变量 常量 2.运算符 逻辑 ...
- Python_基础_Print_输出函数
输出函数print() print()函数: 功能:向目的地输出内容 输出的内容:数字.字符串.表达式 目的地:IDLE.控制台.文件 print()函数可以输出些什么内容? 数字 字符串(用单引号和 ...
- RN 报错信息总结
我使用的是 VScode 编辑器,有时候,卸载包,安装包就会编译失败,解决方式 gradlew clean 编译错误 Execution failed for task ':app:compileDe ...