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
html 样式 :一般使用 css 来渲染HTML元素标签的样式.
一般有四种方法实现
1 行内样式
在HTML标签中直接用style添加 , 最直接,同时修改也很不方便 一般呢都不建议使用
如下
<!--行内样式-->
<h1 style="font-family: '微软雅黑'color:red">非常感谢曾经帮助过我的人,使得自己的技术有了很大的提升</h1>
2 内嵌样式
将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中
3 连接样式
将一个.css 样式文件导入 head 中
使用先创建一个.css文件 然后用link 导入在head标签中
例如
<link href="css/me.css" type="text/css" rel="stylesheet"/>
4 导入样式
使用@import 将.css文件样式引入在style中 ,改变样式
导入式会在整个网页装载完后再装载CSS文件,因此这就导致了一个问题,如果网页比较大则会儿出现先显示无样式的页面,闪烁一下之后,再出现网页的样式。这是导入式固有的一个缺陷。
导入样式有很多写法,可以导入文件路径引用或者 url
使用步骤: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)
}