HTML初学手册

整理文档很辛苦,赏杯茶钱您下走!

免费阅读已结束,点击下载阅读编辑剩下 ...

阅读已结束,您可以下载文档离线阅读编辑

资源描述

自己写的,不值一看。。。本着互相学习,互相帮助的心写的,有疑问的地方,可发送Email到lianglonglongcom@163.com进行提问,我会在最短时间内给予答复。。。学这东西,有句经典的话—就是--------看书不是看小说,看视频不是看电影。。我在加一句(知之为知之,不知百度之,有事没事,咱百度一下)。。。把不会的记下来,然后在去百度,再不会的就去问问。现在开始啦。。。先说说本次培训的主要内容①:HTML要求:(1):会写,就是自己想写成什么样子就出来什么样子(2):认识,就是看见它就知道这东东是什么,有什么作用(3):会改,就是我不喜欢这种表示方式,想换一种表示方式。时间长度:7个工作日参考网站:://wenku.baidu.com/view/1aaf4fb069dc5022aaea0050.html(这个用百度财富值:我的账号水逝流年一号08010254)②:CSS要求:同①的要求时间长度:14个工作日参考网站:://(这个有下一节DIV的内容,)③:DIV要求:同②的要求时间长度:14个工作日参考网站:(这个是视频文件)我宣布---本次培训正式开始啦做好准备实例一:HtmlHeadTitle这是我的第一个网页/Title/HeadBodyHelloWorld!/Body/Html在上面的代码片段中,你会发现,你会发现很多标签都是成对存在的,Html这是一个标示网页开头和结尾的标签,相当于一个人;Head(英语中Head为头),这就是说,这是一个网页的头部;Title(英语中Title为标题),就是给网页起一个名字;Body(英语中Body为身体),就是说网页中要显示出来的东西。不难看出,网页中显示出来的内容为:HelloWorld!你会发现,浏览器左上角就是----这是我的第一个网页-----。见证奇迹的时刻到来啦,你把上面的代码拷贝到一个Txt文档里,然后给该文档起名TestOne.htm或者TestOne.html,然后双击打开,奇迹出来了吧。。。实例二:HtmlHeadTitle这是我的第一个网页/Title/HeadBodyFontsize=”+1”color=”#FF0000”face=”宋体”HelloWorld!/Font/Body/Html你会发现,我怎么好像见过上面写的,可不一样。对呀,上面的实例二就是根据实例一而来的不同的是,对字体做了一些处理。Font:字体,里面有几个属性。首先是size:我就不多说了吧,字体大小(当然,一般的字体是12px,px→像素)color:颜色以十六进制为准则上面那个是红色。Face:字体。现在想想,网页中除了字,还有什么呢。。。。。。。(ˇˍˇ)想~你猜对了,网页中不是有很多图片么,真笨。。。实例三:HtmlHeadTitle这是我的第一个网页/Title/HeadBodyimgsrc=”C:\DocumentsandSettings\Administrator\桌面\HandSomeBoy.jpg”width=”200px”height=”140px”//Body/Html学生A:老师,你不是说那个叫标签的不是成对存在的么,怎么img/不是呢老师:这个,这个,img就算做特例了,他的的确确就是有头没尾,我也拿他没办法。Img(取英语中image→图片的img),表示图片。Src(取英语中source→资源),表示地址,就是这个图片放在哪里的Width(就是宽度)Height(就是高度)都说编程难学,我看也不过如此嘛。。。。好了,今天就到这吧,下面的明天继续,一口气看完了,明天还怎么看。。。。姓名性别小A男小C女这是表格,怎么弄出来呢。。。。众所周知,表格就是由行和列围成的单元格组成的,这就是表格呗。表格table行tr列td实例四:Tabletrtd姓名/tbtd性别/tb/trtrtd小A/tdtd男/td/trtrtd小C/tdtd女/td/tr/table学生C:老师,我发现,你这次写的标签有大写的,有小写的,这个会不会出错呀。老师:不会的,在html里Html与html是一样的,但是为了美观严谨,我们都采用相同的变成风格,这个就看你喜欢什么了。学生C:那什么是单元格呢、、、、老师:像上面这段代码,td姓名/td这个围起来的就是单元格,就是说姓名就放在单元格里了。注意:在网页中,表格是个很实用的排版方式,请看下面的表格表格一OneTwo这怎么弄呀,郁闷。。。。。这就要学习一下两个假单词了,(我不会念,就不标注拼音了。)colspan跨列rowspan跨行实例五:(→表格一)Tabletrtdcolspan=”2”表格一/tb/trtrtdOne/tdtdtwo/td/tr/table(表格一把two上面的单元格占用了)实例六:(→表格二)Tabletrtdrowspan=”2”表格二/tbtdOne/td/trtrtdtwo/td/tr/table(表格二把two左边的单元格占用了)学生C:老师,有点头晕,慢点。。老师:好吧,现在就到这,不会的记得email就行了。。。。。下课,,,,说你呢。。。----------------------------------------------------------------------------------------------------------------------乡亲们女士们,欢迎来到这里,下面就让我进入第二天的学习啦。。昨天提到,网页的标签,字体,图片,表格。今天呢,咱么做一个小小的测试。。。测试一:HtmlHeadtitle网页一/title/headbodytabletrtdcolspan=2表格二OneTwoimgsrc==100pxwidth=150px//td/trtrtdfontface=宋体color=#ff0000姓名/tdtd小彩/td/trtrtdfontface=楷体color=#ffff00性别/tdtd女/td/tr/table/body/Html怎么样,上面的测试就是对昨天学习的做的小测试,跟上了没。。。。上面写的东东复制到txt文档里,然后该名称为test2.htm,奇迹出现了,打开看看吧。。。今天呢,咱么深入学习一下table这个东东。。。表格由行和列组合成的单元格组成,他有跨行和跨列,同时有表格宽度,表格间距和单元格间距。。cellspacing属性用来指定表格各单元格之间的空隙。此属性的参数值是数字,表示单元格间隙所占的像素点数。实例六:<tablewidth=200cellspacing=0border=1bordercolor=#000000>trtd网页/td/trtrtd网页一/td/tr/tablecellpadding属性用来指定单元格内容与单元格边界之间的空白距离的大小。此属性的参数值也是数字,表示单元格内容与上下边界之间空白距离的高度所占像素点数以及单元格内容与左右边界之间空白距离的宽度所占的像素点数。实例七:<tablewidth=240cellspacing=0border=1bordercolor=#000000cellpadding=15><tr><tdwidth=120>小彩加油</td><td></td></tr></table>学生C:老师,这什么意思呀,我怎么晕晕的。。。求解。。。。老师:这个,怎么说呢,干脆把上面的代码拷到txt文档里,然后起个名字,打开看看到底怎么个情况,然后看看红色的字解释,你就会发现,原来是这样呀。。。。上面有个bordercolor----border表示表格边框color颜色也就是说bordercolor就表示表格边框的颜色喽。。。width:这个是宽度,英语中宽的意思。。。图片有宽度,表格有宽度height:这个是高度,图片有高度,表格单元格有宽度也有高度。注意:以后的学习呢,就只写网页中body中的内容,其他的都是一样的。htmlheadtitle/title/head、、、、、实例八:tableborder=1pxtrtdwidth=120align=left小彩加油/tdtdalign=rightwidth=120我也要加油/tdtdalign=centerwidth=220大家都要加油哈/td/tr/table你会发现,上面的代码中加了一个标签align对齐left内容左对齐,right内容右对齐,center内容中间对齐。今天学习的主要对象就是表格了table表格tr→行td→列border→边框width→宽height→高colspan→跨列rowspan→跨行align→对齐cellspacing→个单元格之间的空隙cellpadding→单元格内容与单元格边界之间的空白距离的大小bordercolor→边框颜色就这些了。。同学们,今天这个table很是难办,希望大家好好练习,熟能生巧嘛。。。加油,记得不会就问吆、、、、、----------------------------------------------------------------------------------------------------------------------------安静,安静,上课了,那×××,点名。。。。(+﹏+)~狂晕(¯﹃¯)口水哼(ˉ(∞)ˉ)唧不管了,咱开课。。。。昨天,咱学习了table的有关属性,我想请小彩同学到讲台上来讲讲关于table的一些基础知识。。。~~~^_^~~~我靠(‵o′)凸不胡扯了,开始。网页中除了上面学习的东东外,是不是还有超链接,标题,ahref=”水逝流年一号/home”target=”_blank”水逝流年一号的空间欢迎您的光临/a大家都看到了,a就是超链接,上面那个是文字超链接,图片也可以少连接,ahref=”水逝流年一号/home”target=”_blank”imgsrc==”小龙”//a那target就是打开方式,有四种值,有4个保留的目标名称用作特殊的文档重定向操作:_blank浏览器总在一个新打开、未命名的窗口中载入目标文档。_self这个目标的值对所有没有指定目标的a标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题base标签中的target属性一起使用。_parent这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与

1 / 8
下载文档,编辑使用

©2015-2020 m.777doc.com 三七文档.

备案号:鲁ICP备2024069028号-1 客服联系 QQ:2149211541

×
保存成功