欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  web前端

html 入门_html/css_WEB-ITnose

程序员文章站 2024-01-25 08:37:29
...
HTML是网页开发的基础语言，它用来定制各种网页的元素。比如输入框，按钮、文字、标题等等元素都是有html来定义的。

先来看一个html的框架

就是告诉服务器这个页面是一个html代码文档。这个必须有，虽然还有别的文档格式，但是这种这种写法兼容性最好。


标签提供有关页面的元信息，例：页面编码、刷新、跳转、针对搜索引擎和更新频度的描述和关键词


页面编码（告诉浏览器是什么编码）


刷新和跳转



关键词


描述

例如：cnblogs


X-UA-Compatible

微软的IE6是通过XP、Win2003等操作系统发布出来，作为占统治地位的桌面操作系统，也使得IE占据了通知地位，许多的网站开发的时候，就按照IE6的标准去开发，而IE6自身的标准也是微软公司内部定义的。到了IE7出来的时候，采用了微软公司内部标准以及部分W3C的标准，这个时候许多网站升级到IE7的时候，就比较痛苦，很多代码必须调整后，才能够正常的运行。而到了微软的IE8这个版本，基本上把微软内部自己定义的标准抛弃了，而全面的支持W3C的标准，由于基于对标准彻底的变化了，使得原先在早期IE8版本上能够访问的网站，在IE8中无法正常的访问，会出现一些排版错乱、文字重叠，显示不全等各种兼容性错误。


与任何早期浏览器版本相比，Internet Explorer 8 对行业标准提供了更加紧密的支持。 因此，针对旧版本的浏览器设计的站点可能不会按预期显示。 为了帮助减轻任何问题，Internet Explorer 8 引入了文档兼容性的概念，从而允许您指定站点所支持的 Internet Explorer 版本。 文档兼容性在 Internet Explorer 8 中添加了新的模式；这些模式将告诉浏览器如何解释和呈现网站。 如果您的站点在 Internet Explorer 8 中无法正确显示，则可以更新该站点以支持最新的 Web 标准（首选方式），也可以强制 Internet Explorer 8 按照在旧版本的浏览器中查看站点的方式来显示内容。 通过使用 meta 元素将 X-UA-Compatible 标头添加到网页中，可以实现这一点。


当 Internet Explorer 8 遇到未包含 X-UA-Compatible 标头的网页时，它将使用 指令来确定如何显示该网页。 如果该指令丢失或未指定基于标准的文档类型，则 Internet Explorer 8 将以 IE5 模式（Quirks 模式）显示该网页。更多



Title


网页头部信息


Link


css


icon


Style


在页面中写样式


例如：

.bb{

background-color: red;

}

Script


引进文件


写js代码

...




从代码中我们可以看到一个标准的html网页文件主要由2部分组成

这个标签之间的内容就是用来定义网页的标签栏的内容的

现在我们通过浏览器打开文件看到的就是标签页的有了标题


标签之间的内容就是用来定义页面的内容

再次刷新刚才的页面我们就看到了页面上已经有了文字

常用的标签


p和br标签

p是段落，两行字符之间是有间隔的

p和br都可以是实现字符串换行的效果，但是展示的时候还是有点细微的差别的。

刷新之后的结果如下


a标签

a标签用来定义一个跳转链接

实现的效果如下


另外标签还有一个功能就是定义锚点。也就是我们在网上阅读小说的时候，通过点击标签的链接直接调转到指定的章节。这个需要配置CSS的

标签定义一个指定id名称，然后调用a标签的href属性指定到
的id上就实现了锚点跳转


H标签

H标签是用来标识段落标题的加大加黑字体显示。并且H标签会占用一行

区别只是字体大小不一样


select标签 下拉菜单

运行结果

select还有另一种下拉菜单

运行结果


checkbox多选标签

运行结果


redio 单选框

注意如果单选框的name属性的值都是一样的，则同时只能选择一个选项。如果不指定name属性的值。就可以同时选取多个选项。效果如下：


文本输入框

当type='password'的时候，在框体内输入文字是隐藏的。通过在标签前面使用标签可在框体前面显示框体说明


button按钮

当type="submit"时候配合

标签可以实现表单提交功能。具体实现以后再说~


上传文件按钮

运行结果如下


多行文本输入框

通过CSS的style属性可以设置输入框的宽高尺寸



多级目录标签

运行结果


fieldset标签

运行结果


form表单

运行结果





备注

html语句中常用符号

大于号用 >


小于号用 <


字符之间的空格用

例子如下

其他符号请参考：http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html


上面html介绍的各种代码如下

网页标签测试默认的html语言是不支持通过回车换行的
带有P标签的第一行
带有P标签的第二行
通过br换行符
来分割两行文字

在当前页面跳转到百度在新页面打开百度网页H 标签
H1
H2
H3
H4
H5
H6
select 标签

Checkbox

redio
男女保密

男女保密
password



button

file
提交文件时： enctype='multipart/form-data' method='POST'

textarea

ul ol dl
ul
  • ul.li
  • ul.li
  • ul.li

ol

  1. ol.li
  2. ol.li
  3. ol.li

dl

河北省
邯郸
石家庄
山西省
太原
平遥

fieldset

登录

用户名：

密码：


form 表单



文件:enctype='multipart/form-data' method='POST'

大于号 >
小于号 <
字符之间的空格 a bhtml 入门_html/css_WEB-ITnose

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。

相关文章

相关视频

网友评论

文明上网理性发言，请遵守 新闻评论服务协议

我要评论
  • html 入门_html/css_WEB-ITnose

    • 专题推荐

    相关标签： html 入门

    上一篇： 强烈推荐！ 静态新闻列表自动生成程序

    下一篇： 6-机器学习之KNN（K-近临算法）

    推荐阅读