编写html页面代码需要了解的--综合编完整页

编写html页面代码需要了解的--综合编

作者：西西点击：4次评论：0次标签： html

类型：编程辅助大小：83KB语言：中文评分：5.0
标签：

立即下载

在很多企业面试的时候，尤其是在面试UI（界面层）的面试当中，很多时候要求我们手写html。当然，这里要求的是比如跟JavaScript或者是跟CSS结合着去写。像登录的界面，或者是写个表单，表格。诸如此类的面试，主要考查的就是我们对这些基础的东西，大家熟悉不熟悉。所以，当我们面试程序员或者是美工的时候，这些都是我们需要注意的地方。当然，只要我们静下心，多敲几遍，甚至是在纸上多写几遍，这样的面试、笔试还是很容易通过的。

好下面我们先介绍下浏览器：

五大浏览器：IE【IE6及以下版本（IE7及以上）】、FF(firefox)、Chrome、Opera、Safari(Apple)

搜狗、腾讯TT、遨游（Maxthon）、360浏览器、……(不是一个级别)

浏览器就是解释和执行HTML源码的工具。

同样的一个ie浏览器，不同的版本也会展现出不同的效果，那么在同一台电脑上是不让装多个IE版本的。我们怎么办呢？

一、IETester

htm、html都是静态页面，asp、aspx、jsp、php等都是动态页面。

二、注意的地方

开发工具：

记事本、高级记事本(Editplus、Notepad++、UltraEdit)（推荐）

其他工具：Dreamweaver、Expression Web(FrontPage的改头换面版) 等快速开发工具，这些工具是给页面美工用的。开发人员用VisualStudio写html就够了。

三、基本通用标签

注释使用的是：

四、注意/title

五、运行时的快捷键

接下来介绍下颜色体系的内容：

六、背景颜色

自己搭配颜色：

七、自己调背景色

八、取色

接下来我们说下HTML和XML的联系、区别

html与xml相同点：

都是标记语言、注释都是：

都可以通过dom编程方式来访问

都可以通过CSS来改变外观

html与xml的不同点：

xml比html语法要求更严格。

有开始标签必须有结束标签、大小写一致、属性用双引号等。

xml侧重于数据存储，html侧重于数据展示。趋势：数据存储与数据表现相分离(html中只有要显示的页面内容，样式都有CSS来控制,html页面中不再有等标签，控制样式都用CSS)。

xhtml：可扩展超文本置标语言（eXtensible HyperText Markup Language，XHTML），更符合xml语法规范的html。xhtml的出现主要是为了向xml过度，通过xml+css也能实现很好的页面。【xhtml要求：全部小写、有开始结束标签、属性用双引号】

dhtml： Dynamic HTML的简称，就是动态的html。 HTML、样式表和JavaScript 的组合（现在都是dhtml）

接下来我们再来说下html常用标签：

h标签（标题），HTML定义了

到

六个h标签，分别表示不同大小的字体。h1最大，h6最小。

当搜索引擎搜索的时候，用h标签搜索的概率大于用css方法修饰标题的文章。

只是回车，

是分段。

前后会有比较大的空白，而
则没有。

建议大家把开始结束写全

川川是狗狗居中显示.

a粗体，推荐。b斜体。c带下划线。强调，斜体

当搜索引擎搜索的时候，它会认为放在strong里面的内容更重要。

₂下标，如：H₂O

²上标，如：10²

字体标签，红色。color（设置颜色） size（1-7） face（设置字体,设置字体是注意用户计算机中必须有该字体才能正常显示）

color size（厚度） width（长度） align=left/center/right （默认为剧中显示）

 预格式化  保持本色 （还记得牛逼的三个人么？呵呵。）

九、让分割线立起来

前面我们文章当中用过一些个水平线，但是很多时候我们用CSS来实现。

十、当当网中的事例

下面我们看下：html编码（特殊字符）

十一、转译符

十二、搜狗拼音输入法

® ®

² ²

¥ ¥

³ ³

Html编码查询：

http://www.htmlhelp.com/reference/charset/

十三、查字符集

请看下面一道题目：

十四、转译符2

接下来我们看下:超链接URL的相关内容。

蜘蛛爬虫就是根据超链接爬的，

URL：URL表示资源在网络中的地址，比如 http://127.0.0.1:80/html/pages/a.htm、ftp://192.168.88.128/b.zip。还有URI的概念，比URL大，有的类中使用URI这种说法，可以暂时看成和URL一样就行。

超级链接：XXX 。

URL:统一资源定位符

URI:统一资源标识符。

十五、target

在新的选项卡中打开，需要设置：

十六、在新选项卡中打开

a标签的一些常用属性：href、title、target、name（锚记时用）

十七、title

中还可以嵌套图片，这样就是点击图片打开连接

十八、点击图像到链接

十九、去掉边框

现在要是链到内部自己的网站我该怎么写呢？

只要在同一个目录下，可以直接写文件名。

在a文件夹下的话就写a文件夹下的文件名，如果要是在它父目录下的话，就写..文件名。

相对URL：相对URL表示相对于当前文档的资源，“/”表示网站根目录，“../”表示父目录，“http://www.cnblogs.com/”表示父目录的父目录，“./”或者不写任何斜线表示相对于当前路径的目录。站内引用最好用相对URL，这样域名改变了、目录改变了都不受影响。

接下来我们再说下锚这个作用：

第一步写个锚：

第二步写链接到锚：

二十、锚的使用

二十一、锚的使用演示

接着我们说说：图片

在我们浏览网页的时候，会看到很多的图片：

二十二、图片存储的位置

二十三、图片当中的两个重要的属性

还可以设置图片的宽和高：

二十四、设置宽和高

那么，设不设宽和高呢？当我们打开一个页面的时候，图片比较的大，一开始是一个小点，后面突然变大了。这种情况就是没有设置高和宽。

当我们学习了JavaScript，操作图片的时候，如果不设置图片的高和宽。那么，只有当页面都下载完毕以后，才可以通过客户端写代码的方式来获取图片的高和宽。而如果一开始就设置了图片的高和宽，则图片还没有下载完毕，图片还没有下载完毕也可以获取图片的高和宽。

下面我们说下：缩略图

二十五、改变图片的大小

当我们改变图片的大小的时候，光该后缀名不行，必须在画图这样的软件里面去改。

二十六、制作缩略图

关于不同的图片有什么区别，请大家看下下面的链接：图片格式

以后我们写程序的时候，自动生成缩略图，自动加水印，都是真正的把图片改了。

px (Pixel)单位名称为像素，相对长度单位，像素（px）是相对于显示器屏幕分辨率而言的（随着屏幕分辨率而变化）,国内推荐； QQ截图也是使用PX作为长度宽度单位。

em单位名称为相对长度单位。相对于当前对象内文本的字体尺寸，国外使用比较多；如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

接下来我们再看下列表和表格:

dl→definition list(定义列表)，见备注1。

一般可用于名词解释之类。

ul→unordered list(无序列表)，注意多个ul嵌套时的写法。见备注2

大家去一些个网站,找个有二级菜单的网站,用ul和li来实现的.通过CSS来控制。

二十七、具有二级菜单的网站

ol→ordered list(有序列表)，见备注3。

用嵌套ul或ol来模拟二级菜单。见备注4。

都有一个type属性，用来设置序列的显示样式。type的取值可以是：A、a、1、i、I、disc、circle、square。(可用CSS控制ul、ol的type样式)

插入备注位置：

1 2 3 4 5 6

爱 8
水煮鱼 9

10 11

爱 13
水煮鱼 14

15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

姓名	性别	工资
张三	男	9000
张三	男	9000
张三	男	9000
张三	男	9000

44 45 46

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

学生成绩表
英语	数学	语文
100	100	100

21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44

学生基本情况
姓名	性别	专业
刘备	男	计算机
孙尚香	女
诸葛亮	男

45 46 47 48

编写html页面代码需要了解的--综合编

相关评论

阅读本文后您有什么感想? 已有23人给出评价!

热门评论

最新评论

发表评论查看所有评论(0)

推荐文章

相关下载

最新文章

编写html页面代码需要了解的--综合编

相关评论

阅读本文后您有什么感想? 已有23人给出评价!

热门评论

最新评论

发表评论 查看所有评论(0)

推荐文章

相关下载

最新文章

发表评论查看所有评论(0)