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. vs的任务列表

    前几天才刚开始看到这个 很多时候,一些任务,怕忘记了,或者已经做好的东西,由于各种原因,暂时不用等等这种情况 这时候,就可以在vs上,随时加到任务列表中,方面下次直接来修改或实现等等 在vs的视图&g ...

  2. SqlServer Function 实例

    ① sql server function 创建 这里使用一个计算年龄精确到分的function作为一个demo, create Function [dbo].[fn_GetAge] ( @BIRTH ...

  3. 开发辅助 | 前端开发工程师对 UI设计、交互设计的认知

    1.UI 用户界面 UI:User Interfase 用户界面 UID:User Interfase Designer 用户界面设计师,多指移动 app 的界面设计: 2.一个合格的 UI 设计师, ...

  4. 微信公众号测试账号-redirect_uri域名与后台配置不一致,错误代码:10003

    微信公众号测试账号-redirect_uri域名与后台配置不一致,错误代码:10003 进入公众平台测试账号. 登录公众账号--"开发者中心"--"公众平台测试账号&qu ...

  5. java容器基础

    总结一下学过的java容器知识. 一.java容器框架 由于之前学习的java容器类比较混乱,先简单的整理一下java集合框架. 首先,像这种图,网上到处都是,因为这个也算比较准确吧,我也懒得自己画了 ...

  6. Java语言特点与学习

    Java语言是一款面向对象的一款高级语言是由Sun Microsystems公司(现已被oracle公司收购).由James Gosling和同事们共同研发,并在1995年正式推出,据oracle官方 ...

  7. 一、frp官方中文文档

    frp 是一个可用于内网穿透的高性能的反向代理应用,支持 tcp, udp, http, https 协议. 目录 frp 的作用 开发状态 架构 使用示例 通过 ssh 访问公司内网机器 通过自定义 ...

  8. 新手学python-Day4-进制,数据类型,编码转换,列表

    python3中字符串的编码转换 names=b'\xe2\x82\xac20'.decode('utf-8') print(names) names='€20'.encode('utf-8') pr ...

  9. VUE:过渡&动画

    VUE:过渡&动画 vue动画的理解 1)操作css的 trasition 或 animation 2)vue会给目标元素添加/移除特定的class 3)过渡的相关类名 xxx-enter-a ...

  10. Spring配置文件中指定init-method属性的作用

    bean 配置文件属性 init-method 用于在bean初始化时指定执行方法,用来替代继承 InitializingBean接口.相关链接:https://www.cnblogs.com/Joe ...