html怎么运行

html-css08

html怎么运行,第1张

html运行方法:选择文件夹、建立HTML文件、运行HTML文件。

1、选择文件夹

首先,在电脑某一位置创建一个文件夹,创建完成后回到VS Code在“文件”中找到“打开文件夹“选中并打开你刚刚创建的文件夹。

2、建立HTML文件

打开文件夹后,便可建立HTML文件了,建立过程如下,但要注意的是:文件的后缀名一定要写且为.html输入完名称后按下回车即文件创建成功。

3、运行HTML文件

创建完HTML文件后,按!+tab键可以生成HTML文件标准格式,之后输入你想在浏览器中呈现的内容,写完单击鼠标右键在属性框内点击open in(default)broswer即可在浏览器中运行啦!

Visual Studio Code介绍

Visual Studio Code(简称 VS Code / VSC)是一款免费开源的现代化轻量级代码编辑器,它的特点免费、开源、多平台,以及集成git,代码调试,插件丰富等有点,被大家逐渐熟知和认可。

使用步骤:1.安装gulp以及gulp-file-include(NodeJs上)

2.新建gulpfile.js,配置 gulp-file-include:

var gulp =require('gulp')//引入gulp

var fileinclude  =require('gulp-file-include')//引入gulp-file-include

gulp.task('fileinclude', function() {

    gulp.src('src/**.html') .pipe(fileinclude({//gulp.src中存放要编译的文件

           prefix:'@@',

           basepath:'@file'

    })).pipe(gulp.dest('dist'))//gulp.dest中存放编译后的文件的存放地址

})

3.通过@@include('include/header.html')引用header.html

4.在命令行工具里,执行gulp fileinclude。执行完毕后,dist目录里就有相对应的html文件。

使用步骤:1.安装gulp-ejs(NodeJs上)

2.新建gulpfile.js,配置 gulp-file-include:

var gulp = require('gulp')//引入gulp

var ejs  = require('gulp-ejs')//引入gulp-ejs

gulp.task('ejs', function() {

     gulp.src('Views/Business/financeManage1.ejs')//gulp.src中存放要编译的文件

         .pipe(ejs({},{ext: '.html'}))//设置生成的文件后缀名为html

        .pipe(gulp.dest('Views/dist'))//gulp.dest中存放编译后的文件的存放地址

})

3.通过<%-include ../template.html  %>引用template.html

4.在命令行工具里,执行gulp ejs。执行完毕后,dist目录里就有相对应的html文件。

1.将项目放于本地服务器如xampp下

2.<iframe src="../template.html" width="100%" onload="reinitIframeEND()"></iframe>

3.function reinitIframe(){

        var iframe = document.getElementById("iframepage")

        console.log(iframe)

        try{

            var bHeight = iframe.contentWindow.document.body.scrollHeight

            var dHeight = iframe.contentWindow.document.documentElement.scrollHeight

            var height = Math.max(bHeight, dHeight)

            iframe.height = height

        }catch (ex){

            console.log(ex)

        }

}

var timer1 = window.setInterval("reinitIframe()", 500)//定时开始

function reinitIframeEND(){

        var iframe = document.getElementById("iframepage")

        console.log("3")

        try{

            var bHeight = iframe.contentWindow.document.body.scrollHeight

            var dHeight = iframe.contentWindow.document.documentElement.scrollHeight

            var height = Math.max(bHeight, dHeight)

            console.log(bHeight+":"+dHeight)

            iframe.height = height

      }catch (ex){

            console.log(ex)

     }

     // 停止定时

     window.clearInterval(timer1)

}

HTML文件制作方法如下:

一、打开简单的文本编辑器。大部分文本编辑软件都能编写HTML,不过,复杂的软件有自动格式功能,比较难组织HTML页面。

                                 

二、将文件格式改成“网页”(Web Page)、“.html”或“.htm”,存在容易找到的位置。上面三个选择是一样的,没有差别。

                                 

三、用网页浏览器打开文件,双击文件,它应该会自动在浏览器打开,但现在还只是个空白网页。

                                 

四、更新网页,查看已保存的更改。将<strong>Hello</strong>输入空白的文件。

更新浏览器上的空白网页,你应该可以看到网页上方有个加粗的“Hello”字眼。在本教程中,你随时可以测试新的HTML。只要保存.html文件,然后更新浏览器窗口,就能看到浏览器如何诠释HTML。

                                 

六、构建文档。删除HTML文档里的所有东西。这个HTML代码告诉浏览器你使用哪一版HTML,网页所有内容都在<html>和</html>标签之间。

                                 

七,添加head和body标签。HTML文档分为2个部分。“Head”部分是特别信息,例如网页标题。“Body”部分则包括网页内容。

                                   

扩展资料

一个网页对应多个HTML文件,超文本标记语言文件以.htm(磁盘操作系统DOS限制的外语缩写)为扩展名或.html(外语缩写)为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件,只用修改文件后缀即可。

标准的超文本标记语言文件都具有一个基本的整体结构,标记一般都是成对出现(部分标记除外例如:<br/>),即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。

标记符<html>,说明该文件是用超文本标记语言(本标签的中文全称)来描述的,它是文件的开头而</html>,则表示该文件的结尾,它们是超文本标记语言文件的开始标记和结尾标记。

文本标记语言源程序的文件扩展名默认使用htm(磁盘操作系统DOS限制的外语缩写为扩展名)或html(外语缩写为扩展名),以便于操作系统或程序辨认,除自定义的汉字扩展名。在使用文本编辑器时,注意修改扩展名。而常用的图像文件的扩展名为gif和jpg。

超文本标记语言源程序为文本文件,其列宽可不受限制,即多个标记可写成一行,甚至整个文件可写成一行;若写成多行,浏览器一般忽略文件中的回车符(标记指定除外);对文件中的空格通常也不按源程序中的效果显示。

完整的空格可使用特殊符号(实体符)“&nbsp(注意此字母必须小写,方可空格)”表示非换行空格;表示文件路径时使用符号“/”分隔,文件名及路径描述可用双引号也可不用引号括起。

标记符中的标记元素用尖括号括起来,带斜杠的元素表示该标记说明结束;大多数标记符必须成对使用,以表示作用的起始和结束;标记元素忽略大小写,即其作用相同,但完整的空格可使用特殊符号“&nbsp(注意此字母必须小写,方可空格)”。

许多标记元素具有属性说明,可用参数对元素作进一步的限定,多个参数或属性项说明次序不限,其间用空格分隔即可;一个标记元素的内容可以写成多行,标记符号,包括尖括号、标记元素、属性项等必须使用半角的西文字符,而不能使用全角字符。

HTML注释由"<!--"号开始,由符号”-->“结束结束,例如<!--注释内容-->。注释内容可插入文本中任何位置。任何标记若在其最前插入惊叹号,即被标识为注释,不予显示。

参考资料:百度百科--HTML