Home  >  Article  >  Backend Development  >  PHP笔记(HTML篇)

PHP笔记(HTML篇)

WBOY
WBOYOriginal
2016-06-23 13:39:53924browse

学过很多语言,最近终于决定要学PHP了。

学习PHP,首先总要学习HTML,那么,我也从HTML开始吧!

 

首先学习任何编程语言,看再多书,都离不开它??帮助文档

HTML帮助文档:http://pan.baidu.com/s/1hqxOymo

 

不说不知道,近年来比较火的HTML5,是HTML的一个发展方向,HTML的发展方向如下图,一边是多元化的HTML5,另一边是规范化的XML,过程中还衍生了XHTML!

做网页,总避免不了要使用颜色,颜色有两种表示法,单词表示法和十六进制表示法,其中,十六进制表示法表示的颜色比较全,我也整理了一篇博文,以供查看。

RGB颜色表:

 

编程语言总有一些特殊符号不能直接作为文本显示,HTML也不例外,这些特殊符号在HTML中称为实体,博主也整理了一篇HTML实体对照表,供不时之需。

实体对照表:

 

网页代码是由浏览器直接解析的,编写网页必须选择一种编码,常用的编码有UTF-8、GBK、GD2312等,而浏览器也可以选择一种编码去解析网页。那么,问题来了,如果浏览器选择的编码和编写网页的编码不一致怎么办?解决的办法有是三个:

  1. 使用最多人用的编码方式适应浏览器
  2. 设置浏览器的编码去配合网页
  3. 使用标签

很明显,一种编码不能适合所有人,而让用户修改浏览器编码也不够智能,所以,前两种都是治标不治本,第三种方法才是王道。

 

是单标签,其用法是

以UTF-8为例:

标签的其他用法,可查看帮助文档。

 

标签可设置超链接,如将相对路径装换为绝对路径、打开方式等。是单标签,其具体用法可参考帮助文档。

 

的属性设置会默认为整个网页的默认设置,可设置字体颜色(text)、背景颜色(bgcolor)、背景图片(background)、背景属性(bgproperties)等,还是查看帮助文档!

 

是段落标签,这个标签比较特殊,既可用作单标签也可用作双标签。用作双标签时,标签之间的内容作为一段显示;作为单标签时,从标签处开始换行。双标签的用法比较标准,也比较普遍。

 

标签是双标签,标签内的文本会按照原格式输出,与<xmp>不同,<pre class="brush:php;toolbar:false">标签内的标签是可以被解析的,而<xmp>内的标签是不能解析,以文本形式输出的!   <p> </p>   <p></p></xmp>
  • 标签搭配
      使用,
    • 为列表(list)标签,是双标签,标签间的内容作为列表中的一项显示,默认无序;
        标签搭配
      1. 标签,使列表变为有序列表;
          标签搭配
        • 使用,作为无序列表组。这些标签的属性可查看帮助文档。

           

          ,下标标签和上标标签,均为双标签。

           

          PHP笔记(HTML篇)叫做图像标签,用于显示图片,为单标签,src属性设置图片链接,title属性设置鼠标放在上面时显示的名称,alt属性设置图片加载失败显示的名称。其他属性可查帮助文档。

           

          是链接标签,用于超链接,为双标签。href属性设置链接地址,title属性设置标签放在上面时显示的名称,target属性设置打开链接的方式,其他属性,可查看帮助文档。

          标签设置锚点,用于链接到特定区域,用name属性。name设置一个名称,href属性设置为"#"+name的名称,即可链接到本页name所在处;若href设置为网页路径+"#"+name的名称,则可链接到该网页的name所在处;herf属性设置为"#"或为空时,跳转到本页头。

          当前页跳转

          跳转到其他页面

           

          URL:统一资源定位符

          URL组成:以http://i.cnblogs.com/EditPosts.aspx?postid=4275104&update=1为例

        • 协议名称:http://、ftp://、https://、file://等(http://)
        • 主机名:(i.cnblogs.com)(cnblogs.com是域名)
        • 端口号:80、8080、等(范围:0~65535)(80)
        • 资源名称:访问的文件(EditPosts.aspx)
        • 参数:"?"后面的键值对,多个参数用"&"连接(get传参,参数可见;post传参,参数不可见)(postid=4275104&update=1)
        •  

          URL的相对路径:

        • ./:代表本地路径
        • ../:代表上级路径
        • ../../:代表上上级路径(以此类推)
        •  

          标签用于构建表格,为双标签。width属性设置表格的宽度,heigth属性设置表格的高度,border属性设置表格的边框,cellspacing属性设置单元格之间的宽度,cellpadding属性设置单元格内容与边框之间的距离。

          标签嵌套
          标签使用,用于设计表格的行,为双标签。

          标签使用,用于表示表格的单元格,为双标签。rowspan属性设置跨行,属性值表示跨越的行数;colspan属性设置跨列,属性值表示跨越的列数。

          标签使用,用于表示表格的表头,单元格的内容字体加粗、居中。

          更多属性可查帮助文档。

           

           

          HTML的框架(frame),也称为分帧,即将多个页面组合成一个页面显示。

        • 优点:
        • 重载页面时,不需要重载整个页面,增加了网页下载的速度
        • 方便制作导航栏
        • 缺点:
        • 多个页面,不易管理
        • 代码复杂,无法被搜索引擎索引到
        • 多框架的页面会增加服务器的http请求
        • 小型的移动设备无法完全显示
        • 由于以上缺点,不符合标准网页设计理念,已被抛弃,但后台可以使用,所以,还是要学习。
        • 框架的标签:

        • 标签,双标签
        • 标签代替了标签,定义框架页面,所以使用标签就不用标签
        • border属性设置框架边框的大小
        • rows属性设置框架的行数及高度,需要多少行就编写多少行的大小,“*”表示剩余空间,用“,”隔开
        • cols属性设置框架的列数及宽度,需要多少列就编写多少列的大小,“*”表示剩余空间,用“,”隔开
        • 可嵌套使用,使框架格式多元化
        • 标签,双标签
        • 用于显示每个页面的内容,嵌套在中使用;
        • src属性设置页面的路径,以显示其内容
        • name属性可设置frame的名称,供链接显示
        • 标签的target属性可指定显示页面的frame
        • 标签的target属性设置为“_parent”时,表示它的上一级框架显示,设置为“_top”时,表示顶级框架显示,及整个网页

        • 布局显示

           

          超链接

        • 标签,双标签
        • 当浏览器无法加载框架的时候,会显示标签内的内容
        • 嵌套在标签中使用,搭配标签使用
        • 创建一个包含另一个文档的内联框架
        • 其中的内容可在不支持该标签的浏览器中显示
        • 在标签中使用
        • 关于框架的其他属性和用法,可查看帮助文档!

           

          表单:可以把输入的数据传送到服务器端的程序的html元素

        • 标签,双标签
        • 表示HTML表单
        • action属性设置数据传送的目的地
        • method属性设置传输方式,可设置为get和post
        • get传输的信息较少,速度较快,提交信息会显示在地址栏,不安全
        • post传输的信息较多,速度较慢,提交信息不会显示在地址栏,较安全
        • enctype属性设置数据发送到服务器的编码类型
        • application/x-www-form-urlencoded:窗体数据被编码为名称/值对,为标准编码格式,默认值
        • multipart/form-data:窗体数据被编码为一条信息,页面上的每个控件对应信息中的一部分,上传文件时使用
        • 标签,单标签
        • type,代表一个输入域的显示方式(分为输入型、选择型、点击型)
        • text,单行文本输入域,输入型
        • password,密码输入域,输入的字符显示为"*",输入型
        • file,文件上传,输入型
        • checkbox,复选框,选择型
        • radio,单选框,选择型
        • hidden,隐藏域,一般用于传递默认值, 
        • button,按钮,点击不会提交表单,可进行其他操作,点击型
        • image,图片按钮,点击会提交表单,点击型
        • submit,提交按钮,点击可提交表单,点击型
        • reset,重置按钮,点击型
        • name,表单项的名称
        • 通常设置为与数据库中相对应的字段名相同
        • 点击型不需要该属性
        • 传输数据时的标识符
        • 复选框的name值一般使用数组表示
        • 单选框的name值相同时,选项相互排斥
        • value,表单项的值
        • 选择型设置该属性值,选择后,可随表单传输
        • 点击型除image,设置该属性,即设置按钮显示名称
        • 输入型设置该属性值,设置默认value值
        • maxlength,限制文本输入长度
        • 多行文本域,可输入多行文本
        • cols,设置列数,通过列数,设置宽度
        • rows,设置行数,通过行数,设置高度
        • 其余属性与标签输入型一致
        • 下拉菜单
        • name属性设置表单项名称,通常与数据库字段名一致
        • multiple属性设置表单为多选
        • 嵌套在
        • value属性设置选项的值,选择后,随表单传输
        • selected属性设置默认被选中
        • 标签可设定文本与选项绑定,达到点击文本即可选择的作用
        • 关于表单的其他属性和用法,可查看帮助文档!

          标签,双标签
        • 图层标签,用于定位元素或布局
        • 层中的内容可放到浏览器任意位置,可放入HTML元素
        • 常与CSS结合使用
        • 由于常与CSS结合使用,在学习CSS时再深入学习!

           

          至此,HTML的基本元素已经学完了,可以开始制作简单的静态网页了,但是离动态网站还远着呢!接着来学CSS吧!

          标签嵌套
          标签嵌套
  • Statement:
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn