作为学习前端的小白,选择了sublime_text3作为学习的编译器。学习的过程是艰辛的,但也是快乐的。遇到自己不会的,有时候会折腾好几个小时,在实现预期效果的时候,那种兴奋真的难以言述。

今天,在学习资料的时候,遇到了一个问题:如何实现界面之间的跳转?常用的是<a href="跳转链接">,如:<a href="http://www.baidu.com">百度</a>,当点击百度时,它会自动跳转到百度界面。

但是,如果想实现跳转到自己编码的界面,该如何去做呢?如:

链接可以实现跳转,当点击“进入网页”时,进入编辑好的另一界面

那么,如何在sublime_text中实现呢?单独进行一个页面的设置比较容易,如何将它们放在一起呢?第一想法是创建一个项目。

首先,在电脑上建立一个文件夹,之后在sublime_text中的Project下Add Folder to Project,选择刚才所建立的文件夹,它就成了一个小项目,之后,使用快捷键Ctrl+N新建html网页,保存到文件夹下面。也就是说,这个网页属于这一个项目,之后的网页建立亦是如此。如:我建立的文件夹名称是sublime_text实验,下面有三个网页

当执行2.html时,就出现了主页面。

下面是每个网页的源代码:

2.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>主页面</title>
</head>
<body bgcolor="yellow">
<center><h2>主页面</h2>
<img src="C:\Users\Administrator\Desktop\总\往期资料\picture\1.png" width="500" height="300"/><br/><br/>
<a href="enter.html">进入网页</a><br/><br/>
<a href="exit.html">离开网页</a><br/><br/>
</center>
</body>
</html>

enter.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>页面进入</title>
</head>
<body bgcolor="yellow">
<center><h2>页面进入</h2>
<img src="C:\Users\Administrator\Desktop\总\往期资料\picture\2.png" width="500" height="380" /><br /><br />
<a href="2.html">返回</a>
</center>
</body>
</html>

exit.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>页面离开</title>
</head>
<body bgcolor="yellow">
<center><h2>页面离开</h2>
<img src="C:\Users\Administrator\Desktop\总\往期资料\picture\3.png" width="500" height="380" /><br /><br />
<a href="2.html">返回</a>
</center>
</body>
</html>

初次总结不够完善,我会慢慢成长的,脚下的路还很长。

在sublime_text3中实现项目的跳转的更多相关文章

  1. Node.js中的不安全跳转如何防御详解

    Node.js中的不安全跳转如何防御详解 导语: 早年在浏览器大战期间,有远见的Chrome认为要运行现代Web应用,浏览器必须有一个性能非常强劲的Java引擎,于是Google自己开发了一个高性能的 ...

  2. 如何将Eclipse中的项目迁移到Android Studio 中

    如何将Eclipse中的项目迁移到Android Studio 中 如果你之前有用Eclipse做过安卓开发,现在想要把Eclipse中的项目导入到Android Studio的环境中,那么首先要做的 ...

  3. 【笔记】android sdk集成的eclipse中导入项目

    android sdk集成的eclipse中导入项目 想要把旧的ADT项目,一模一样的导入进来,需要: 1.把项目放到,非当前ADT的workspace目录下: 2.从Project中Import,选 ...

  4. 在WeX5中导入项目

    在WeX5中导入项目 首先右击,选择[导入]--[导入] 得到如下的对话框,选择[现有项目到工作空间中] 在导入对话框中选择相应的根目录,选择相应的项目,确定 点击完成即可.这样一个项目就被导入到了W ...

  5. 开发环境中biztalk项目设置注意事项(转)

      适用版本:biztalk 2006 适用环境:开发测试环境 在开发过程中,在开发环境中,一定会是一个对项目不断的修改.编译.部署.测试,查看测试结果,发现有问题,然后回到开发环境再修改.编译.部署 ...

  6. eclipse 本地项目提交到远程库以及从远程库中添加项目 ---git

    本地项目提交到远程库 1.右击项目->team->share project 2.选择本地库 从远处库中的项目拉到本地 1.右击项目->import项目

  7. eclipse中导入项目后中文成乱码解决办法

    转自:http://blog.163.com/lang_zi_ming/blog/static/1140161762010412112650774/ 编程时在往eclipse中导入项目后 项目中的中文 ...

  8. 关于myeclipse中maven项目转换相关设置

    关于myeclipse中maven项目转换相关设置 在myeclipse菜单中,Configure->Convert to Maven Project 这个菜单 如果没有的话,需要做如下设置: ...

  9. [转]-如何将Eclipse中的项目迁移到Android Studio 中

    英文地址:http://developer.android.com/sdk/installing/migrate.html 翻译:Android Studio 中文组(大锤译) 如果你之前有用Ecli ...

随机推荐

  1. 集群管理工具Salt

    集群管理工具Salt 简介 系统管理员(SA)通常需要管理和维护数以百计的服务器,如果没有自动化的配置管理和命令执行工具,那么SA的工作将会变得很繁重.例如,要给集群中的每个服务器添加一个系统用户,那 ...

  2. PHP 5.5以后加速插件:Zend Opcache

    大家知道目前PHP的缓存插件一般有三个: APC. eAccelerator. XCache,但未来它们可能都会消失,因为PHP 5.5已经集成 Zend Opcache,功能和前三者相似但又有少许不 ...

  3. Forms Authentication in ASP.NET MVC 4

    原文:Forms Authentication in ASP.NET MVC 4 Contents: Introduction Implement a custom membership provid ...

  4. [google面试CTCI] 2-2 找出链表的倒数第n个节点元素

    [链表] Q:Implement an algorithm to find the nth to last element of a singly  linked list . 题目:找出链表的倒数第 ...

  5. 教你用shell写CGI程序

    以前用shell写过一些cgi的例子.今天向大家介绍一下. CGI是一种接口的标准,并不区分编程语言,也就是说,CGI可以用任何一种语言编写,只要这种语言具有标准输入.输出和环境变量.CGI会将标准输 ...

  6. 关于MEF

    MEF(Managed Extensibility Framework)是.NET Framework 4.0一个重要的库,Visual Studio 2010 Code Editor的扩展支持也是基 ...

  7. 消除Switch...Case的过程

    http://www.cnblogs.com/happyframework/p/3300170.html 目录 备注需求第一遍代码(重复的代码)第二遍代码(消除重复)备注 备注返回目录 不要重复自己, ...

  8. Go语言Web框架gwk介绍4

    Go语言Web框架gwk介绍 (四)   事件 gwk支持事件系统,但并没有硬编码有哪些事件,而是采用了比较松散的定义方式. 订阅事件有两种方式: 调用On函数或者OnFunc函数 func On(m ...

  9. U盘安装CentOS 6.4 + Windows 7双系统 (Windows 7下安装 CentOS 6.4)

    最近在看<鸟哥私房菜:基础学习篇>,觉得很不错,想要装个windows 7 和 CentOS 6.4 双系统,在网上找了很多教程,觉得乱七八糟的,弄得很复杂,而且很多都不是很完整,对于新手 ...

  10. $.each()方法,其实挺不错的

    例子为主 html主要代码 <div class="fl search">厂商:<select id="firms"><optio ...