当前位置: 首页 > article >正文

入门级 如何编写第一个网页

一、使用记事本,编写代码

首先,如图所示,在任意一个盘中新建一个文本文档,命名为"hello"(任意命名即可)。

然后将这段代码复制进去。

<!doctype html>
<html><head><meta charset="utf-8"><title>我的第一个网页</title></head><body><p>hello,这是我的第一个网页哦</p></body>
</html>

呈现出如下图所示:

 保存后退出。

二、更改文件格式

打开文件拓展名。

显示拓展名后,将原本的".txt"等后缀改为".html",如下所示。

右击打开方式,使用浏览器打开即可。

感觉有点单调,可以稍微增加一点css样式。 

<style type="text/css">p{font-size: 36px;color: blue;text-align: center;}</style>

编辑进文档中,在用浏览器打开

 

大功告成,冒号后的可根据自己喜好调整。

三、 总结及注意

1 文件名后缀以  .html 结尾。

2 在编写代码的过程中,<>中的任何字符必须是英文状态下编写。

3 不区分大小写

四、介绍

1 标签有两种表现形式:

   

双标签,例如:<html></html>

单标签,例如:<br/>

2 DOCTYPE声明 

DOCTYPE是document type(文档类型)的缩写。<!DOCTYPE html>是H5的声明,位于文档的最前面,处于标签之前。他是网页必备的组成部分,避免浏览器怪异模式。

html标签

定义HTML文档,其他元素都包含在他之中,此标签限定了文档的开始点和结束点。

<!DOCTYPE html>

<html>

</html>

head标签

head标签用于定义文档的头部。文档的头部描述了文档的各种属性和信息,包括文档的标题、在web中的位置以及和其它文档的关系等等。绝大多数的文档头部都不会显示出来让读者看到。

<!DOCTYPE html>

<html>

       <head>

       </head>

</html>

body标签 

body标签定义文档主体。包含文档的所有内容(比如,超链接,文本,图像,表格等等。)

他会直接在页面中显示出来让读者看到。

<!DOCTYPE html>

<html>

       <head>

       </head>

        <body>

              这些文字将会显示在浏览器中。

        </body>

</html>

title标签 

可定义文档的标题。

他显示在浏览器窗口的标题或状态栏上。

<title>标签是<head>标签中唯一必须包含的东西。

<title>的增长有利于SEO的优化。

<!DOCTYPE html>

<html>

       <head>

             <title>我的第一个网页</title>

       </head>

        <body>

              这些文字将会显示在浏览器中。

        </body>

</html>

meta标签

meta标签通常用来描述一个文档的属性。例如,charset="utf-8"是说当前使用的是utf-8编码格式。

中文编码:

gb2312:简体中文

gbk:简繁体中文

utf-8:所有文字

 <!DOCTYPE html>

<html>

       <head>

             <title>我的第一个网页</title>

             <meta charset="utf-8">

       </head>

        <body>

              这些文字将会显示在浏览器中。

        </body>

</html>

简单的第一个页面制作就完成了。

可留言讨论,有问题欢迎指出。 

http://www.lryc.cn/news/2414238.html

相关文章:

  • 【实验学习】思科模拟器学习
  • Windows系统shdocvw.dll文件丢失导致功能异常问题
  • 在线辞源辞海
  • 潇洒郎:用cxfreeze打包py文件为exe文件全过程——呕心吐血经验——安装、调试、解决KeyError: 'TCL_LIBRARY'问题、最终成功、打包方便技巧
  • 【Google论文】The Google File System 译文
  • 推荐一款国内好用的Java CMS内容管理软件,功能强大,灵活好用(附源码)
  • 爬虫有用的数据网站
  • MySql触发器介绍及应用
  • 【NLP】语义分析
  • 【算法合集】学习算法第二天(二分与排序篇)
  • SSM宠物店管理系统-计算机毕业设计源码93755
  • 解决Windows提示d3dx9_36.dll找不到
  • Mathcad使用数学表达式
  • 2022年茶艺师(高级)考题及答案
  • C语言项目-学生信息管理系统
  • windows编程------TextOut与TextOutw与TextOutA,基于vs2010
  • linux Shell 命令汇总 (持续更新)
  • Event/window.Event属性和方法
  • FTP服务简介(工作原理、连接模式、流行服务器软件)
  • 高德Mapabc地图标注 基础篇
  • return true和 return false区别
  • matlab importdata显示,MATLAB中导入数据:importdata函数
  • windows系统关闭指定端口
  • B2B大型电子商务门户网站系统源码+160多套企业网站模板+安装搭建教程
  • 解决Windows丢失mfc71.dll问题
  • 指针的指针和指针的引用
  • ARP协议是什么?底层原理是什么?
  • CreateDialog和DialogBox的区别,模态对话框与非模态对话框
  • 如何制作个人网站(如何搭建个人博客)
  • RedHat认证介绍