1、语法和规范

HTML文件都是以.html或者.htm结尾的。建议使用.html结尾。
HTML文件分为头部分(<head></head>)和体部分(<body></body>)
HTML标签都是由开始标签和结束标签组成。(<hr />)
HTML标签不区分大小写,建议使用小写。

2、HTML相关标签学习

  2.1标题标签

  标题标签使用<hn />,n从1到6字体大小逐渐变小,超过6的按6显示
    特点:加粗加黑,单独占用一行,与其他行有一定行间距
    注释:<!--注释内容--> 快捷键Ctrl+/

  2.2水平线标签

  水平线标签 <hr />

  2.3段落标签

  段落标签<p></p>

  2.4字体标签

  字体标签<font></font>
  必须结合其属性才能具备一定的样式效果。

      属性:size:指定内容的大小(从1到7逐渐变大,超过7的按照7来显示)
           color:指定内容的颜色(可以是英文单词,也可以是十六进制)
           face:指定内容的字体(那些字体必须是你本机已经有的)

  加粗:<b></b>
  斜体:<i></i>
  下划线:<u></u>

  注意:HBuilder同样支持Alt+/自动输出提示。

3、在HBuilder中新建HTML文件,命名为网站信息显示页面,代码如下:

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网站信息显示页面</title>
</head>
<body>
<!--1.创建一个标题标签-->
<h2>皮囊师</h2> <!--2.创建一条水平线标签-->
<hr /> <!--3.分别创建段落标签-->
<p>
<font color="red">演皮影戏的师傅</font>正弓着背在一张矮桌子上修补坏了的皮影。他的手边有好多皮影,有红有绿,有男有女,有兔有马,仿佛一个完整的世界。而他,就是那个世界的造物主。     
</p> <p>
世人皆知<b>皮囊师</b>,而很少听说<i>操控师</i>,是因为绝大部分人只注重容颜,而不注重行为举止。皮囊师兴盛于皇城,尤其后宫,操控师也兴盛于皇城,但在后宫不如皮囊师受欢迎。只有少数皇帝的嫔妃知道,容颜只能引起皇帝的注意,但那只是一时之兴,而行为举止才能让皇帝处久不厌。于是,宫中出现了一种女官,名为司仪,授九品衔。司仪专门教宫中女人举止仪态,后来又教一些关系亲密的嫔妃如何勾引皇帝,让皇帝恋恋不舍,尽可能多地逗留。
</p> </body>
</html>

保存文件,点击在浏览器内运行,效果如下:

HTML基础——网站信息显示页面的更多相关文章

  1. HTML基础——网站友情链接显示页面

    1.列表标签 有序列表:type默认是1,2,3……,reserved指降序排列 <ol type="I" start="" reversed=" ...

  2. laravel基础课程---4、Laravel基础网站结构搭建

    laravel基础课程---4.Laravel基础网站结构搭建 一.总结 一句话总结: 1.搭建网站前后台路由:在路由组Route::group()中设置好命名空间和前缀 2.搭建控制器:比如1)新建 ...

  3. 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变

    查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...

  4. Bootstrap <基础二十三>页面标题(Page Header)

    页面标题(Page Header)是个不错的功能,它会在网页标题四周添加适当的间距.当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题这个功能就显得特别有用.如需使用页面标题(Page ...

  5. 如何在一个网站或者页面写js

    如何在一个网站或者页面写js: 1. JS的分层(功能):jquery(tools)  组件(ui)  应用(app).mvc(backboneJS) 2. JS的规划(管理):避免全局变量和方法(命 ...

  6. 用Teleport Ultra下载网站全部页面 爬虫

    测试case,就是把Commons-FileUpload 的API下载来   上网查的时候我才发现这是一个由很多页面组成的网站,下载起来很麻烦.   怎么办呢?呵呵,一定是有办法的.Teleport ...

  7. php的借用其他网站的页面覆盖Logo的技巧

    php的借用其他网站的页面覆盖Logo的技巧, <body> <div id="red_f"></div> <div class=&quo ...

  8. 【ASP.NET 问题】ASP.NET 网站404页面返回200,或者302的解决办法

    做网站在优化网站时遇到了跳转404页面却返回 200.302状态的问题,这样的话搜索引擎会认为这个页面是一个正常的页面,但是这个页面实际是个错误页面,虽然对访问的用户而言,HTTP状态码是“404”还 ...

  9. HTML&CSS——网站注册页面

    1.表单标签 所有需要提交到服务器端的表单项必须使用<form></form>括起来! form 标签属性:  action,整个表单提交的位置(可以是一个页面,也可以是一个后 ...

随机推荐

  1. 前端将图片二进制流显示在html端

    工作中碰到的问题,在处理接口返回的验证码图片时,由于返回的是encode编码代码,在js端获取到数据之后,通过函数encodeURI()来进行解码,之后可以通过在src中设置来实现图片显示:

  2. C# 读取硬盘信息 ManagementClass类

    一.在很多情况下,你可能都需要得到微机的硬件信息.需要加上下面的这句话: using System.Management; 获取硬件信息,需先知道硬件参数信息: Win32_Processor, // ...

  3. Lucene倒排索引结构及关系

  4. java的-D命令行参数 mvn -D参数

    java的-D命令行参数 我们会用mvn启动一个应用,如下的命令行: MAVEN_OPTS="-XX:PermSize=256m -XX:MaxPermSize=512m" mvn ...

  5. Image解码

    Image解码 可以看到从CFDataRef直到创建出UIImage,都没有调用过对图像解码的函数,只读取了一些图像基础数据和元数据. Image解码发生在什么时候?在ImageIO/CGImageS ...

  6. javascript: 基于原型的面向对象编程

    Douglas Crockford指出javascript是世界上最被误解的编程语言.由于javascript缺少常见的面向对象概念,许多程序猿认为javascript不是一个合适的语言.我在做第一个 ...

  7. Reflection (computer programming) -反射-自身结构信息

    n computer science, reflection is the ability of a computer program to examine, introspect, and modi ...

  8. 关于C++程序运行程序是出现的this application has requested the runtime to terminate it in an unusual way. 异常分析

    今天运行程序是出现了this application has requested the runtime  to terminate it in an unusual way. 的异常报告,以前也经常 ...

  9. JS怎样计算过关分数

    一个游戏,前20关是每一关自身的分数,//21-30关每一关是10分//31-40关,每一关是20分//41-49关,每一关是30分//50关,是100分 <!DOCTYPE html> ...

  10. gcp – 源于CP的高级命令行文件拷贝工具

    作者:linux 出处:http://linux.cn/thread/11868/1/1/ gcp – 源于CP的高级命令行文件拷贝工具 几周前,我们讨论了高级拷贝(修改于cp命令,让其可以显示复制进 ...