macbook air深空灰和银色选哪个好?

发布网友 发布时间:2022-04-20 07:05

我来回答

3个回答

懂视网 时间:2022-05-13 13:19

上一篇:《CSS3小分队??text分身text-shadow》 写在前面:

前段时间自己用CSS绘制了一个银色的MacBook Air,今天把它从电脑硬盘深处挖了出来,我把我的思路和想法写下来和小伙伴们分享分享。先把最后的效果给大家。

这其实是一个半成品,键盘上的其他图标和文字都还没有加,图标的话可以用font-face,有机会的话把它补全给大家。

小伙伴们也可以去codepen上查看高清无码大图,给出链接:

http://codepen.io/myvin/pen/yNezZR

这里使用了CSS的before、after伪元素、渐变gradient、阴影、nth-child选择器等相关内容,阴影和渐变效果从图片上可能看的不太清楚,小伙伴们可以去上面的codepen上查看,文章的最后我会给出整个源代码,有兴趣的可以自己随意修改完善。

Ok,开始进入。

对于键盘,就是建立了一个无序列表ul,然后写上若干个li即可,其他的用几个div包裹即可,先给出HTML结构:

 1  2       3    4    5 6     7    ... 8     9 10   11      12   13  

4个div加上2个伪元素,总共六个部分构成整个MacBook Air。board是MacBook Air的底座,blackbar是屏幕的那个黑色旋转轴,keyboard是键盘,touch是触控板;board:before是上面的盖子,border-bottom是盖子下面的那个黑色细长条。Ok,这六部分构成了整个MacBook Air。

用图来说话:

接下来,我按照我的绘制顺序一步步来说。小伙伴们赏个脸看下去啊啊啊~~~~~

一、第1步

先给出HTML,下面是一段很长很长但是却没什么可看的代码,让滚轮飞起来吧:

 1  2   3  4   5   6   7   
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • !1
  • 23
  • @2
  • 24
  • #3
  • 25
  • $4
  • 26
  • %5
  • 27
  • ^6
  • 28
  • &7
  • 29
  • *8
  • 30
  • (9
  • 31
  • )0
  • 32
  • ?-
  • 33
  • +=
  • 34
  • 35
  • 36
  • Q
  • 37
  • W
  • 38
  • E
  • 39
  • R
  • 40
  • T
  • 41
  • Y
  • 42
  • U
  • 43
  • I
  • 44
  • O
  • 45
  • P
  • 46
  • 47
  • 48
  • 49
  • 50
  • A
  • 51
  • S
  • 52
  • D
  • 53
  • F
  • 54
  • G
  • 55
  • H
  • 56
  • J
  • 57
  • K
  • 58
  • L
  • 59
  • 60
  • 61
  • 62
  • 63
  • Z
  • X
  • 65
  • C
  • 66
  • V
  • 67
  • B
  • 68
  • N
  • 69
  • M
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • By Pure CSS.To Be Continued.
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85 86 87 88 90

    键盘按键为若干个li,其中按键上有两个符号的我用两个span包了起来,像这个:

    1 
  • !1
  • 因为它们最后的体位是一上一下一上一下(是69么。。。。。),用span包裹好布置它们的体位。

    先绘制一个600*450的div,并将board居中,给一个银色的color,这里用的是rgb(210,210,210),用border-radius绘制出四个20px的圆角,用box-shadow给出一个灰色的阴影,这里用的灰色是rgb(160,160,160),小伙伴们可以根据合适的自己来选择颜色,最后从div的左下角到右上角以60度添加一个线性渐变linear-gradient,是从白色开始从四分之一出过渡到灰色。因为之后的div会用到绝对定位,所以在此先把其父元素board定位为relative。完整的代码及效果如下:

     1 .board{ 2 margin: 0 auto; 3 padding: 0 auto; 4 width: 600px; 5 height: 450px; 6 margin-top: 50px; 7 background: rgb(210,210,210); 8 border-radius: 20px; 9 position: relative;10 box-shadow: 0px 5px 6px rgb(160,160,160);11 background:-webkit-linear-gradient(60deg,rgba(250,250,250,1) 25%,rgba(210,210,210,1));12 }

    这样,一个有阴影和线性渐变过渡效果的面板就完成了。

    二、第2步

    接下来我要画笔记本盖子,就是伪元素board:before。

    因为盖子是翻起来的,所以从上往下看是一个窄边。把board:before填充为780px*20px的div,背景颜色为灰色。实现及效果如下:

    1 .board:before{2 content: ';3 display: block;4 width: 780px;5 height: 20px;6 background: rgb(210,210,210);7 }

    然后调一下位置,board:before定位为绝对定位,board宽600px,盖子宽780px,所以left=-(780-600)/2=-90px,top为board:before的高20px,顺带做出一个大弧形的效果,水平半径取大一些,垂直半径取小一些:

    1 border-top-left-radius: 390px 18px;2 border-top-right-radius: 390px 18px;

    对border-radius不太熟悉的小伙伴可以查看之前的《CSS3小分队??进击的border-radius》。

    此时的效果如下:

    有那么个意思了,为了做出立体的效果,我们给盖子从上到下加个渐变的过渡效果:

    1 background:-webkit-linear-gradient(top,rgb(210,210,210) 50%,rgb(255,255,255));

    再顺带把屏幕下的那条小黑条加上,一句话很简单:

    1 border-bottom: 2px solid rgb(0,0,0);

    看看效果先:

    有没有感觉某些地方有些违和?放大看一下这里:

    来个更加菊部的:

    对,就是这个小角处,给点效果:

    1 border-bottom: 2px solid rgb(0,0,0);

    再看看效果:

    这样黑边那也有了小的弧度过渡,显得更加自然。

    附上这一步的完整代码和效果:

     1 .board:before{ 2 content: '; 3 display: block; 4 width: 780px; 5 height: 20px; 6 background: rgb(210,210,210); 7 border-radius: 0px 0px 3px 3px; 8 border-top-left-radius: 390px 18px; 9 border-top-right-radius: 390px 18px;10 position: absolute;11 top:-20px; 12 left: -90px;13 border-bottom: 2px solid rgb(0,0,0); 14 background:-webkit-linear-gradient(top,rgb(210,210,210) 50%,rgb(255,255,255));15 }

    因为随笔较长,所以分了两部分,今天先谈第一部分,完整的html和css我会放在第二部分的最后提供下载,欢迎大家随意修改。

    上一篇:《CSS3小分队??text分身text-shadow》

    热心网友 时间:2022-05-13 10:27

    macbook air深空灰好。

    MacBook Air,是2008年2月19日苹果公司推出的笔记本。MacBook Air笔记本具有11.6寸和13.3寸两个尺寸,最低起售价格6288元。

    2018年推出的MacBook Air有金色、银色和深空灰色三种外观,配备加入了原彩显示技术的视网膜显示屏;机身由 100% 再生铝金属打造。

    2020年3月18日,苹果发布新款13英寸Macbook Air。

    2020年11月10号,苹果推出了搭载Apple Silicon芯片(M1)的13英寸MacBook Air。

    功能特点

    键盘:新款MacBook Air 采用1毫米键程剪刀式结构按键,带来灵敏舒适又安静的输入体验;背光按键配合环境光传感器,还能帮你在光线较暗的环境下进行输入。

    Apple T2 安全芯片:MacBook Air采用 Apple T2 安全芯片,当使用触控 ID 解锁 Mac 或文档时,存储在固态硬盘上的所有数据都会自动、完整地进行加密。在 MacBookAir 上能使用“嘿 Siri”功能。

    热心网友 时间:2022-05-13 11:45

    付费内容限时免费查看回答您好,个人认为MacBook觉得哪种颜色好看是带有个人主观偏见的,并没有一套固定的评判标准

    提问你就告诉我那个比较好看,又是流行色,不会容易过时的

    回答您好,如果您要购买苹果笔记本的话,推荐您可以购买这款:Apple MacBook Air 13.3 新款八核M1芯片(7核图形处理器) 8G 256G SSD 深空灰 笔记本电脑 MGN63CH/A

    提问你认为买几G的比较不容易淘汰

    回答深空灰这款颜色是属于比较耐脏的,并且由于天然带有的陈旧感,整体会比银色更耐用

    目前的话8g+256g就足够日常使用了

    提问如果想使用房产绘图哪款好用以及内存

    回答房产建筑类的,比较好用的软件推荐CAD,基本上做建筑的都在用

    内存选择8G就够用了哈

    提问对

    cAD推荐苹果笔记本那款好用

    回答如果您要购买苹果笔记本的话,推荐您可以购买这款:Apple MacBook Air 13.3 新款八核M1芯片(7核图形处理器) 8G 256G SSD 深空灰 笔记本电脑 MGN63CH/A

    cad这款软件对电脑配置要求不高的哈,任何型号的苹果电脑都足够驾驭

    声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com