hello小伙伴们,今天我来给你们带福利啦:小可爱要给你们偷偷透课程!要知道腹黑塔内而且不招收会员的呢!
但是!!为了让你们充分了解塔内,我们决定将网络部大鳄们的培训内容对外放送,机会难得噢!是不是超棒棒哒?夸我夸我~
我们明天要教给你们的内容是:制作网页!诶诶诶别着急走哇(⊙o⊙)!听我把话说完嘛~网页的制做并不难,只要你有一台笔记本!一切都不是问题!小可爱我以部门丑照担保(理直气超壮)所以如今就打开笔记本,和我一起开始网页制做之程吧~~(期待地搓搓手嘻嘻)
万事开头难,只要我们坚持住!!只要完成这第一步,我们能够赢!!稳住!!
好滴,我来告诉你们第一步要做哪些:没错!就是打开笔记本!!哇!!大家都打开了,居然那么厉害的吗??好吧好吧,看来做网页对你们来说实在是轻而易举哇!!
(假装)正经上去,我们要进行第二步了:打开系统自带的文本编辑器(坏笑)。这一步我相信会难倒好多同学哇(但是这是难不倒我的,知道吗嘿嘿嘿)
第三步:输入html基本框架,见右图
准备完毕,保存文本文档。重命名的时侯将文件格式改为html。接下来就是我们的创作时间啦!!盯
一行对着一行输哦,可别搞错啦~
在创作之前,我们须要认识一下那些带 标签的涵义:
好的,那么我们就开始输入文本吧!
首先要给网页起个好听且独一无二的标题,标题是哪些呢?标题出现在浏览器的标题栏里,就是会出现在网页最上方的那行字(举个百度的板栗)
大家要清楚噢~
好了,那么如今要给网页平添内容了。内容这一栏就在两个标签之间啦!输入任意你喜欢的东西,就会出现相应的文字。
这里要告诉你们一个小小的知识点:html文本的段落是通过
标签定义的,而段落的小标题是通过定义的。不要忘记有始有终噢,闭合标签(结束标签)可不能少!
另外,
这个标签是一个换行标签。由于它没有任何意义,所以它没有结束标签。需要换行的时侯直接加上
就好啦~
这样有疑问的孩子就站上去了:“我应当如何插入图片使网页更有表现力呢?”
这真是个好问题,图片应当如何插入html呢?
首先,你须要找到你喜欢的图片的地址(复制图片的地址copy copy~)
然后输入一个定义图象的标签
这里的img表示image;src表示source;只要在双引号上面粘贴图象的地址就成功啦!哇这真的是太easy了吧
bingo
试过了这两项的宝宝们很不开心,因为文字与图片的摆放位置实在太难看了。图片在文字下方,而文字贴近着网页的最上方!!纷纷表示这实在是对她们的耳朵引起了极大的伤害!(呜呜真委屈呀)
那么好啦,为了大家开心happy forever,我要来告诉大家,怎样使文字和图片放置到你想要的位置去。
想要对html进行修饰,就必须使用css来调整款式啦。我们在这儿介绍内联款式:
在定义段落的
标签里加入定义款式的文字:
style="left: 100px; position: absolute; top: 100px;"还可以在style旁边的冒号内加入color:#******;
看看,就像是这样子:
Nice
哼那些你们一定都晓得的,宝宝才上完伤脑的模电基础好冷的,才不解释呢
介绍到这儿我们的宝宝们开始激动上去:呜哇啊原先制做网页如此有趣的吗!!?可是我还是对我的网页式样倍感死亡,怎么办才好呢?接下来,我们来学习一下如何使用css吧~所有小伙伴们都要加油努力不舍弃哦!!
css 样式由选择符和申明组成,而申明又由属性和值组成,如下图所示:
而css又分为三种:内联式css,嵌入式css以及外部式css。
上面我们谈到了内联式css。那么下边来介绍一下嵌入式css和外部式css:
嵌入式css样式,就是可以把css样式代码写在标签之间。
这个是为每一个标签加入sytle=“xx=x;xx=x;”,使标签内的内容得到修饰。
塔内PC 致力于服务同窗 锻炼自我
(大家可以尝试运行一下这个代码噢~看看有哪些非常的地方,找找规律哟)
外部式css:
外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以”.css”为扩充名,在
塔内PC致力于服务同窗修练自我
将css写在独立的css文件中,然后在html页面的head部份引用
(不过这儿我们先不做空说明)
我们来实操一下嵌入式css吧~输入文本
▲为标签设置id="ID名称"。
▲ID选择符的后面是井号(#)
是不是超棒棒!!好啦明天我们就讲那么多啦,希望你们课后有时间多练练手。
给你们推荐慕课学习html与css的相关知识~希望你们能作出好看的网页哟~比心心~
文案:网络部