00:00
我们先把第四频的布局给做了吧,啊,咱们是不是现在画了1123123吧,我们再来瓶等C。CTRLV05好,我们做第四题。咱们把这个第视频的布局咱们来看一看。好,一样,我把参数拿过来。第四屏CTRLC,第四第五屏全部拿过来,CTRLC啊,这个全部都要,只要你直接贴过来。好,我们看第四屏,好先打开完整版。准确CT。好,打开完整版。
01:03
好,走你我们去第视频,咱们要做这个小广,是不是图片炸裂的小广,好问你,首先我就上来问一个问题吧,这个效果用外事做你,你说靠谱吗?你这个很明显是干嘛,上面叠叠层,下面还有一层是不是,然后上面是不是图片有一个炸裂效果,十字扎十字架型的炸裂效果吧,那这炸裂效果的话,有没有同学觉得是控制这个每一瓶的吗?这上面肯定有四个结构的。你说控制的外靠谱吗?不靠谱干嘛?方向太多了,方向都不一样吧,那怎么办?肯定是定位。定位好控制。能不理解是不是?那肯定是我在外部干嘛。我在外部干嘛?我定义出四个容器来。这四个容器里面放一量表,每张都是一个比较完完整的图。
02:04
是不是然后再去实现这个战略效果。能不能想到OK,那我们什么如果没想到,待会我们什么慢慢来做嘛,是吧,OK,这里我们先把这个布局给他写了几个结构。一个两个,这个就给一个大容器吧,三个是吧,三个里面再包两个,还是不是还是不是还有条线。是不是啊,走你咱们先把把这个几个几个结构给他了吗?那这个线你一开始你肯定看不到啊,是吧,因为那个线是背景上的是吧。哎,你怎么还是打打开这个孩子。好,这里去第四题,好,这个线用看法也可以画吧,啊,可是这个线在我们这边是个背景图片,OK,而且你可以看到这个线啊,比如说我们找到这个线。
03:11
来了同事。看一下应该是他是不是绿色的线嘛,你看之前做的方式的话,我们都是用图片的形式看。一根线是KB啊,受不受得了啊,用用用看法画呢。1KB都没啊,几行代码是不是啊,OK啊,那不一样的这个等级。好。这里,那我们把第四瓶的这个东西我们画一画吧,OK,找到第四瓶吧,首先是不是应该让他跳到第四瓶,木在哪边,木就是在最后吧,是吧,OK,跳到第四,跳到第四应该是三吧,你就S来走你。
04:00
好,把这个布局我们来画一画,好找到报上。好,About在哪边?Body啊,这是head,这是home,都已经做完了,现在是他,好吧,是不是?OK,走你一模一样的套路吧。啊,OK,来个什么还是吧,还里面分几个结构。失败是吧,OK。SPAOK,打一个什么好,CTRLC。CCTRLLCTRLL。C。Control。是不是给一个plus是不叫什么。
05:00
八一吧。好走,你那下来还有什么?一个先给个容器吧,第叫什么拉about,二是里面肯定是一个什么P标签,是是P标签里面是大段的文本,CTRLCCTRLVCTRL是不是这个换法的话,待会其实我给一个什么。容器快速换了,而且这个英文字母的换行跟中文的换行还不一样。中文的换法的话,是不是比如说一个单词,比如说干嘛,比如说我的名字是不是OK,一个单词,你我这个一个名字有有没有可能给你。接一到有可能你就去第上了,是不是啊,我名字要被写成是雄物,好问你英文,英文单词有没有可能在一半时候给你截掉,不可能,你看你看这个单词可能干嘛放在这边就干嘛,一出去了要立马把整个单词全部给你个麻烦放下面来,懂不懂把这英文跟中文不一样的地方啊,注意一下。
06:13
好呃,那其实我们来看看,我来刷一下是不是有了,OK,我们说看啊,这个应该加什么。这个叫什么?给这个给这个标吗,我们。是不走,你刷一下是不就过来了,然后把把些什么,把些基本的参数给他秒一秒,标题空隙上右下左段就说微写写了,这应该比较简单了吧。OK,只有你,我们说要写第几题啊?第四屏,第四屏在哪?
07:01
好,我把第四频的这个。这个是workers第四名是不是它是吧,我把这两个东西全部全部定下来吧,CT啊,这边干掉干掉干掉T好下来第三瓶。Join引,OK,我们现在现在现在是做它啊,那这是第四题,TCTRLC啊,不用let写,整个结构极其不好啊,真的就是上课的感觉比较累,用那写的话,到后期你们会写样式,会写的十分轻松。那第四频CTRLCTRL好,About好,记住我们说这个about是什么?是那个LY吧,那下面还有一层三形的,我们在上面已经指定过了,它是一个定位的元素啊,宽高是1100520是不是OK这里,然后这边干嘛,我们说是谁啊他了谁。
08:07
八号差不能这个符号吧,是不是点八号一是不是你会发现前端的话,你可能写错一点,点东西你就完了。是不是不像后台你有一个极强的容错能力啊,他们可能稍微写错一些东西的话,立马就能定位到,我们写错一些东西的话,说实话不好定位,你也不知道是你钥匙写错了还是你什么。就是GS哪块东西写错了,因为它没有一个很好的报错机制,是不是就是你的控子在上面错的话,你能立马就定位到什么东西错了吗?不一定啊啊有可能是错了,也有可能吗?解错了是不是啊对来我们来看一下啊包一我们什么马是五十零一百五十八是吧?这个我就不带你们看了。50PX0100PX50是不是OK,那差不多应该。
09:09
顶出来了吧,是吧,OK,那这个看一下文本宽400,左边空隙50 OK文本文本是什么二。左边吧,LEFT50。是不是宽呢?是吧?好。走,你在这差不多吧,啊,可能这个背景有点淡啊,我感觉是吧,啊,咱先不管了,好,咱们是不是有条线没有画。咱们是不是你看。啊,这是要报吧,这是要报那个三形吗。是不是咱们只画到BO2是吧,这两个东西是不是齐了,那是不是线跟这两个框了,OK,那我们来看一下好E什么。
10:01
是不是再给class好class我们就about。三哦,里面应该有几样东西?来看一下这个效果啊,波三是外面这个大的容器是吧?OK,这里面是不是有两个好,那我给两个div叫什么?一般取什么名字,艾特吗?两个指向吗?是吧?艾特吗?问题这个命名重重复他有关系吗?没关系,你只要外面这个拉没就行。懂不懂,可是你选的时候必须得一层一层找下来,不然是会出问题的,懂吧,OK,这里来看一下这个it里面我来问大家。艾特里面应该怎么写?艾是最大的那个东西吧?OK,看看这里面应该有几样东西。大家有没有发现是前面一张图,后面一张图。去不了,OK,那怎么办?这边我来个SPA行不行?这个SPA我待会放后面这张图。
11:00
啊,失败div都可以嘛,这边我拿个败,只是待会要去给大家去演示一个问题,懂吗?那最好可以拿div嘛,是吧?OK,那外面呢。上面这个图片炸裂的肯定是个ul加LY的结果。是不是啊,OK。那我就来一个有,当然你里面可以再可以再去写吧,写四个吗?四个里面干嘛。你看这是一个。Oh my god,来看。这是我们的一个UR网。是不是,然后你可以在这个里面再来试点LY嘛。是不是,然后每一个里面去放一个是吧,完整的你卖吧,通过定位把这个图片给他。拼出来。是不是比如说这个我放你的左上角,这个放右上角。是不是就出来了能不讲,那是不是我们说底下应该有四个LY,每个L里面都有一个一外角,是不是啊,那这边的话我就不在,就是爱里面写了知不道,因为我待会用加直接给他。
12:12
生成我只在这边摆个U行不行,行,OK,这里拿下来,而且我问你这个ul要不要提供给信息啊,你得告诉他用哪张图片吧。是不是这我们以后换图片是不是也比较好换。是不是所这边我给他一个自定义,对他什么杠S行不行,待会你告诉我这个UI上应该放哪张图片。是不是这个道理啊,OK,那它是不是也来个第三个C啊,是不是好,那至于放哪张图片,我们待会再来看,能没讲好那还算什么。还找什么线是不是,咱把这个线也描一描线嘛,是不是啊,最后就包成什么。
13:07
四吧,稍微我们什么统一一点是吧,OK,来看这根线,那我们先把它的样式我们先画一画好这里好怎么画样式。好,首先画那根线吧。那个线是比较好画,就是一个低,就是什么老婆的丝嘛,看它的尺寸嘛。好现的背景吧,是不是也有个高宽的,他就是放那个背景图的懂吗?357998,只要998来看一下外,没到357P还998P是吧,你想都不想,他待会肯定要定位的好看来看一下它是不是等于是一个背景啊,OKURL。硬麦底下的一条绿颜色的。线是吧,No上是吧,一旦想,一旦写到这个背景,这个样式就长了,好看一下它在哪。
14:09
说下你没看到线,没有用背景。嗯,让这个拼量我们也来指定这里那的直接给零,呃拓也直接给零,看到这样。上来。有没有看到线是不在这边,这个线是最好稍微出去点,那这个图给个多。负的100PS吧。肯定会出去一点。整点最好让他去颜色比较深的地方吧,是吧,那个嘛,Top的话给个50%吧。周年。是不是就过来了这条线。在这吧,OK,看上一笔。
15:01
啊,这个咱们暂时先不管是吧,OK,这里是不是过来啊,把那两个框给他描一描,那两个框是什么做少。报他三吧,报三底下什么?是吧,你点下来点OK,这两个尺寸看是多少。什么200配量是都已经。告诉你了是不是,而且是不是边框是。透明的是不是有一个圆角吧,我们看嘛。边框是不是透明的,有圆角肯定是有偏移的吧,是吧?来看他们两个尺寸应该是一样的吧,两百六乘以200是吧?那外是不。260PX呢,200PXOK,你把这个变化给他的多少。
16:02
边框多五像数吧,是不你。5PX的实心啊,走你什么RGBA?嗯。拿过来,CTRLC。CTRLLCTRL看见了。这是摆着吧,有个圆角吧,圆角怎么下。比如啊波reduce是不是圆角,是不是给八了好,讲圆角的时候有没有给大家去提供一个点。移动端是不是最好用,像数字啊。为什么移动端用像素值百分比?移动端不支持吧?记不记得好。说一下走你是不是这的拼音过来就行,好,每个拼音是不是不一样的,走你。
17:01
Ctrl c nice try是第一个,OK,然后是。第二个肯定是需要你定位定起来的行,为什么不思路上啊,这时候其实他参照是谁,谁来定位啊,是三不是报的三也不是报,是他们俩之间的一个三,OK,这你然看他把他的定位属拿过来,第一个请C接过来。OK,第二个啊,这些东西就贴了,就要C贴过来。是吧,来看一下刷一下。怎么掉了?过来了吧,可是这根线是不是压着框的,我应该是框压着线嘛,是吧,那怎么办,把他们定位成这个嘛。
18:03
Z-1T乘二吧,就SOK。好,是不是线压的框了。是吧,那怎么办,看不到是不是守你。是不是线压的话啊,不是,是不是框架的线是的吧,那到这一块干嘛好,那布局是不大,大体上位置是不是已经对了,是不是,那下一节课把这个什么。效果给他干嘛,加上就可以了,对讲好大下课谢吧。
我来说两句