返回列表 发帖

[技术交流] 【表格详细教程_新手必学】

本帖最后由 云若朵 于 2012-6-10 21:26 编辑

dafa888bet官网 www.eurokiddies.com


新手篇
                                                  ——基本表格教学

《前序—可以无视》

相信很多新童鞋都在为不会做表格而烦恼吧。

想在素材区发靓帖,如果没有漂亮的表格来衬托,就算你的素材在美也只是浮云,犹如一个缺胳膊少腿的人。

想要满足别人的视觉效果,就得有漂亮的表格。

记得2月份的时候我才正式接触论坛,那时候表格是神马玩意儿我都不知道,每次发帖就几张光溜溜的图片在那,自己都看不过去。

首先,我想说,你如果想做出各式花样表格,就必须得有耐心,没耐心的话你绝对学不好的。我自己也是,经常为了做一个表格,用几个小时时间反复修改的。这我就不多说了,试过的人懂,没试过的说了也白搭)


其实表格这东西,说简单不简单,说麻烦不麻烦,只要掌握它的几步要领之后,想做一个表格,就是手到擒来了。

表格是死的,我们要用脑子把它玩活。

好吧,偏题了!

此教程发给新童鞋看的。

各位老师们就别埋汰我了。







首先,在帖子右上角有个源码,请把那个钩钩去掉

然后点击表格按钮 准备插入表格






1.表格行数、列数
相信这个大家都明白 几行几列 需要根据自己的要求来制作可为多行多列 也可为单行单列


2.表格宽度
这个参数是需要大家注意的本站最宽的表格参数为570即


570 :由于超出最大尺寸 所以为全帖最宽显示 与实际尺寸不符



但是由于560宽度的表格和570会差很多 所以一般我们最大只用到560即


560  :标准尺寸 与实际尺寸吻合



3.表格颜色
这项可以根据大家的爱好来选择颜色 颜色搭配好的表格 会给人一种耳目一新的感觉
综上所述,表格的最基本概念很简单,了解了这些,表格就成功了一半。


一般表格框自带的颜色都是不全面的,所以我们就要依靠配色表
在配色表里选择自己喜欢的颜色代码。

一个帖子的配色也是很重要的,列如,你的图片是全黑的,你不可能弄一个绿色的表格吧,那样就显得很不匹配。



关于颜色代码在表格框如何使用,请看下图:




简单的说:就是在配色表里找到你需要的颜色代码,然后再到这文字式的输入即可。

附件: 您需要登录才可以下载或查看附件。没有帐号?注册
1

评分人数

  • Doris_韵

我用无悔、刻永世爱你的碑

本帖最后由 云若朵 于 2012-6-10 18:53 编辑


『新手进阶』
                                                       ——多层次表格教学

鼠标点进我们做的单层表格里

←在这里点一下鼠标


然后再次点击插入表格的图标

插入里面一层的表格


在这里要注意的是里面一层表格的尺寸为了美观 一半里面一层表格的宽度 比外面一层表格宽度小10-20为好


外层300 里层290


   
外层300 里层280


如此 里面还可以插入1-2层表格
就做出了漂亮的多层次的表格
当然,多层次的表格也可以是多行多列的


附件: 您需要登录才可以下载或查看附件。没有帐号?注册
我用无悔、刻永世爱你的碑
本帖最后由 云若朵 于 2012-6-10 18:58 编辑


『美帖高手』




    要做好漂亮的表格,其实主要靠自己的想象力 及色彩搭配能力只要大家多多练习 就会做出漂亮的表格帖子

还是那句话,表格是死的,脑子是活的,如果大家敢于动脑,会发现表格可以做的出任何你想要的形状。

不怕你不会,就怕你不动手,希望这些新新宝贝们可以发挥想象,创作出更加漂亮的表格。

下面是我在发帖过程中总结出来的容易出现问题的地方供大家参考

1.如果做好的单层表格,或2层表格里什么都不添加 就是一个细条的效果如下:







也可以做这种有立体感的只要每个表格比上一个宽度小一点就可以


2.若帖子表格内有多行多列表格,则多行多列表格里层尽量只插入单行单列表格一层多了则容易显示出乱码

3.若发素材图片类帖子,每单个表格最好比图片实际尺寸宽度大10为美

4.多行多列表格宽度为整体的宽度 而不是每一个小单元表格的宽度

下面在做个表格示范

1.做11个表格,宽度层层递减再层层递增。如图:

300

280

260

240

220

200

220

240

260

280

300


2、然后在中间的宽度为“200”的表格内利用附件添加图片:

      


3.得到以上效果↑↑↑


关于高手阶段的花样表格,不是一两句话、一两个步骤能说清的
所以我还是建议不懂的童鞋要勤学、多练。


教程到这里就先告一段落了,如有疑问,可给我留言,适当的我会在此帖里详细解答的!

凡是都有个过程,我也是从菜鸟过来的

总之,想学习用表格美化帖子,你必须得有耐心、勤学多练。



附件: 您需要登录才可以下载或查看附件。没有帐号?注册
我用无悔、刻永世爱你的碑
本帖最后由 云若朵 于 2012-6-10 19:09 编辑

下面有100多种,你喜欢的,一定在里面!
将每个颜色后的代码记下来,以后写帖时可以用到哦!
(有些颜色较淡,仔细看看吧~)



■★●◆pink(粉红)    【颜色代码:#ffc0cb】

■★●◆crimson(腥红)    【颜色代码

■★●◆l河蟹enderblush(苍白的紫罗兰红)颜色代码:#fff0f5】

■★●◆palevioletred(脸红的淡紫红)颜色代码:#db7093】  

■★●◆hotpink(热情的粉红)颜色代码:#ff69b4】

■★●◆mediumvioletred(适中的紫罗兰红)颜色代码:#c71585】

■★●◆orchid(兰花紫)颜色代码:#da70d6】

■★●◆thistle(苍紫)颜色代码:#d8bfd8】

■★●◆plum(轻紫)颜色代码:#dda0dd】

■★●◆violet(紫罗兰)颜色代码:#ee82ee】 



■★●◆magenta(洋紫)颜色代码: #ff00ff】

■★●◆fuchsia(紫红)颜色代码:#ff00ff】

■★●◆darkmagenta(深洋紫)颜色代码:#8b008b】

■★●◆purple(紫)颜色代码:#800080】

■★●◆mediumorchid(适中的兰花紫)颜色代码:#ba55d3】

■★●◆darkviolet(深紫罗兰)颜色代码:#9400d3】

■★●◆indigo(靓青)颜色代码:#4b0082】

■★●◆blueviolet(蓝紫罗兰)颜色代码:#8e2】

■★●◆mediumpurple(适中的紫)颜色代码:#9370db】

■★●◆mediumslateblue(适中的的板岩蓝)颜色代码:#7b68ee】

■★●◆slateblue(板岩蓝)颜色代码:#6a5acd】

■★●◆darkslateblue(深板岩蓝)颜色代码:#483d8b】

■★●◆l河蟹ender(熏衣草花的淡紫)颜色代码:#e6e6fa】

■★●◆ghostwhite(幽灵白)颜色代码:#f8f8ff】


■★●◆blue(蓝)颜色代码:#0000ff】

■★●◆mediumblue(适中的蓝)颜色代码:#0000cd】

■★●◆midnightblue(午夜蓝)颜色代码:#191970】

■★●◆darkblue(深蓝)颜色代码:#00008b】

■★●◆n河蟹y(海军蓝)颜色代码:#000080】

■★●◆royalblue(皇家蓝)颜色代码:#4169e1】

■★●◆cornflowerblue(矢车菊蓝)颜色代码:#6495ed】

■★●◆lightsteelblue(淡钢蓝)颜色代码:#b0c4de】

■★●◆lightslategray(浅石板灰)颜色代码:#778899】

■★●◆slategray(石板灰)颜色代码:#708090】

■★●◆dodgerblue(道奇蓝)颜色代码:#1e90ff 】

■★●◆aliceblue(爱丽丝蓝)颜色代码:#f0f8ff 】

■★●◆steelblue(钢蓝)颜色代码:#464】

■★●◆lightskyblue(淡天蓝)颜色代码:#87cefa】

■★●◆skyblue(天蓝)颜色代码:#87ceeb】

■★●◆deepskyblue(深天蓝)颜色代码:#00bfff 】

■★●◆lightblue(淡蓝)颜色代码:#add8e6】

■★●◆powderblue(火药蓝)颜色代码:#b0e0e6】

■★●◆cadetblue(军校蓝)颜色代码:#5f9ea0】

■★●◆azure(蔚蓝)颜色代码:#f0ffff】

■★●◆lightcyan(淡青)颜色代码:#e0ffff 】

■★●◆paleturquoise(苍白的宝石绿)颜色代码:#afeeee】

■★●◆cyan(青)颜色代码:#00ffff】

■★●◆darkturquoise(深宝石绿)颜色代码:#00ced1】

■★●◆darkslategray(深石板灰)颜色代码:#2f4f4f】

■★●◆darkcyan(深青色)颜色代码:#008b8b】

■★●◆teal(水鸭色)颜色代码:#008080】

■★●◆mediumturquoise(适中的宝石绿)颜色代码:#48d1cc】

■★●◆lightseagreen(浅海洋绿)颜色代码:#20b2aa】

■★●◆turquoise(宝石绿)颜色代码:#40e0d0】

■★●◆aquamarine(碧绿)颜色代码:#7fffd4】

■★●◆mediumaquamarine(适中的碧绿)颜色代码:#66cdaa】

■★●◆mediumspringgreen(适中的春天绿)颜色代码:#00fa9a】

■★●◆mintcream(薄荷奶油)颜色代码:#f5fffa】

■★●◆springgreen(春天绿)颜色代码:#00ff7f 】

■★●◆mediumseagreen(适中的海洋绿)颜色代码:#3cb371】

■★●◆seagreen(海洋绿)颜色代码:#2e8b57】

■★●◆honeydew(浅粉红)颜色代码:#f0fff0】

■★●◆lightgreen(浅绿)颜色代码:#90ee90】

■★●◆palegreen(苍白绿)颜色代码:#98fb98】

■★●◆darkseagreen(深海洋绿)颜色代码:#8fbc8f】

■★●◆limegreen(柠檬绿)颜色代码:#32cd32】

■★●◆lime(柠檬)颜色代码:#00ff00】

■★●◆forestgreen(森林绿)颜色代码:#228b22】

■★●◆chartreuse(查特酒绿)颜色代码:#7fff00】

■★●◆lawngreen(草坪绿)颜色代码:#7cfc00】

■★●◆greenyellow(绿黄)颜色代码:#adff2f】

■★●◆darkolivegreen(深橄榄绿)颜色代码:#556b2f】

■★●◆yellowgreen(黄绿)颜色代码:#9acd32】

■★●◆olivedrab(橄榄褐)颜色代码:#6b8e23】

■★●◆beige(米色)颜色代码:#f5f5dc】

■★●◆lightgoldenrodyellow(浅秋黄)颜色代码:#fafad2】

■★●◆ivory(象牙白)颜色代码:#fffff0】

■★●◆lightyellow(浅黄)颜色代码:#ffffe0】

■★●◆yellow(黄)颜色代码:#ffff00】

■★●◆olive(橄榄)颜色代码:#808000】

■★●◆darkkhaki(深卡其布)颜色代码:#bdb76b】

■★●◆lemonchiffon(柠檬沙)颜色代码:#fffacd】

■★●◆palegoldenrod(灰秋)颜色代码:#eee8aa】

■★●◆khaki(卡其布)颜色代码:#f0e68c】

■★●◆gold(金)颜色代码:#ffd700】

■★●◆cornsilk(玉米)颜色代码:#fff8dc】

■★●◆goldenrod(秋)颜色代码:#daa520】

■★●◆darkgoldenrod(深秋)颜色代码:#b8860b】

■★●◆floralwhite(白花)颜色代码:#fffaf0】

■★●◆oldlace(浅米色)颜色代码:#fdf5e6】

■★●◆wheat(小麦)颜色代码:#f5deb3】

■★●◆moccasin(鹿皮)颜色代码:#ffe4b5】

■★●◆orange(橙)颜色代码:#ffa500】

■★●◆papayawhip(木瓜)颜色代码:#ffefd5】

■★●◆blanchedalmond(漂白后的杏仁)颜色代码:#ffebcd】

■★●◆n河蟹ajowhite(耐而节白)颜色代码:#ffdead】

■★●◆antiquewhite(古白)颜色代码:#faebd7】

■★●◆tan(晒)颜色代码:#48c】

■★●◆burlywood(树干)颜色代码:#deb887】

■★●◆bisque(乳脂)颜色代码:#ffe4c4】

■★●◆darkorange(深橙色)颜色代码:#ff8c00】

■★●◆linen(亚麻)颜色代码:#faf0e6】

■★●◆peru(秘鲁)颜色代码:#cd853】

■★●◆sandybrown(沙棕)颜色代码:#f4a460】

■★●◆chocolate(巧克力)颜色代码:#d2691e】

■★●◆chocolatesaddlebrown(马鞍棕)颜色代码:#c00eeb】

■★●◆seashell(海贝)颜色代码:#fff5ee】

■★●◆sienna(土黄赭)颜色代码:#a0522d】

■★●◆lightsalmon(浅肉)颜色代码:#ffa07a】

■★●◆coral(珊瑚)颜色代码:#ff7f50】

■★●◆orangered(橙红)颜色代码:#ff4500】

■★●◆tomato(番茄色)颜色代码:#ff6347】

■★●◆mistyrose(雾中玫瑰)颜色代码:#ffe4e1】

■★●◆salmon(肉)颜色代码:#fa8072】

■★●◆snow(雪)颜色代码:#fffafa】

■★●◆lightcoral(浅珊瑚)颜色代码:#f08080】

■★●◆rosybrown(玫瑰棕)颜色代码:#bc8f8f】

■★●◆indianred(浅粉红)颜色代码:#cd5c5c】

■★●◆red(红)颜色代码:#ff0000】

■★●◆brown(棕)颜色代码:#a52a2a】

■★●◆firebrick(火砖)颜色代码:#b22222】

■★●◆darkred(深红)颜色代码:#8b0000】

■★●◆maroon(粟色)颜色代码:#800000】

■★●◆white(白)颜色代码:#ffffff】

■★●◆white河蟹oke(烟#f5f5f5白)颜色代码:#f5f5f5】

■★●◆gainsboro(赶死部落)颜色代码:#dcdcdc】

■★●◆lightgrey(浅灰)颜色代码:#d3d3d3】

■★●◆silver(银白)颜色代码:#c0c0c0】

■★●◆darkgray(深灰)颜色代码:#a9a9a9】


■★●◆dimgray(暗灰)颜色代码:#696969】  

■★●◆black(黑)颜色代码:#000000】
我用无悔、刻永世爱你的碑
回复 1# 云若朵


   论坛不允许出现外链,请删除。这个教程我建议发至糯米新手教程专区,水区帖子很容易被沉。
本帖最后由 云若朵 于 2012-6-10 20:20 编辑

在给大家介绍一个花样表格的制作过程及应用


表格效果图:1



◤                                                               ◥


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
通常像我们做这样的表格,这里应该是摆放文字的。
当然,随机应变嘛,可以放任何东西在这
无论是大图、还小小横图(当然这两类的话横列只能放一张)
但是,如果放头像的话就可以横着放两张
(只要你抓住图片跟表格的比列就可以随心所欲的摆放)



效果图:2




◤                                                               ◥
- 长相思长相守。
如图1:在这里可以适当放个小装饰或一句话
                                                                              





如上图上半部不变,下半部图1的时候我放的是文字,图2的时候如果放两个头像的话

我们就要在表格里在添加一个表格:(当然,样式、大小(大小注意比例)颜色随自己定。


注:图2里面多加了一个白色表格,整体的表格被撑大了10
如果你想这套表格上下一样宽,那么你就必须把上半部的每一层表格的宽度+10
这个就要看自己的审美效果了,不一定要一样大。
自己觉得怎样好看就怎样弄。

表格依然是死的,我们的脑子终究是活的。




我这里是添加的1行2列 300宽度的表格我这里是添加的1行2列 300宽度的表格


建议打横放的头像大小的表格宽度比列为:

单个头像表格宽度/170-200

双个头像表格宽度/240-400


当然,头像的大小尺寸都不一样的。



你不一定要按照我在这教的死路子去走,我只是告诉你这些小要领。

有句话怎么说来着:技术随心情。(很喜欢这句话)

在啰唆一下下:表格式死的,我们的脑子是活的,要随自己的需要来变化各种各样的表格。


下面这个是此表格的宽度比例:


◤                                                               ◥
宽度:400
宽度:400
宽度:400
宽度:400
宽度:400
宽度:390
宽度:400
宽度:400
宽度:400
宽度:400
宽度:400

外.围的边框宽度是410


宽度:390
宽度:400

附件: 您需要登录才可以下载或查看附件。没有帐号?注册
我用无悔、刻永世爱你的碑
本帖最后由 云若朵 于 2012-6-10 21:22 编辑

花样表格2介绍


像类似表格,建议这里放一句话
Like a similar form, the proposal here put a word
当然也可以什么都不放。随心情

这也可以放一句话或者一个小装饰





此表格的宽度介绍

100

200

250
300

350

410
410
410
380
350
330
300
250
410(这里放图片)
425
435
450

300

780(类似的满屏宽度表格,只要在里面不重复多层就不会乱码)

450

400

300

200

100

500

300

560

500

400

300

290
300







表格的基本介绍就到这里了

最后说下表格的注意事项:


无论你表格怎么重叠都不可在一个表格里超过四层,否则就会乱码

做重叠表格最重要的就是**的那个表格(宽度)


学习的童鞋可以把我上面的几个表格复制过去看下大概结构式怎样的

好多东西光听别人说是不行的,得靠自己去做

勤学多练,多琢磨

希望经常发素材帖的童鞋多多学习下帖子的美化


通过自己的双手制作出自己喜欢的花样表格


不要总是复制别人的表格

那样的话在美的表格在你手中也都是只是个2货


加油!童鞋们!

附件: 您需要登录才可以下载或查看附件。没有帐号?注册
帖内回复
兔子不吃胡萝卜 在 2012-6-18 22:19 说:
仰望,小朵子好厉害....
我用无悔、刻永世爱你的碑
LZ赞啊,真是很棒的帖子~
我有一个小狗弟弟叫阿宝,所以叫宝他姐
回复 7# 云若朵


   悲剧的发现~~原来我木有权限移过去~~
回复 8# 宝他姐


    谢谢~O(∩_∩)O~
我用无悔、刻永世爱你的碑
返回列表
免责声明:本站所有内容均由网友收集与网络,本站不承担由于内容的合法性及真实性所引起的一切争议和法律责任。网友上传的电子书仅供书友预览使用,版权属于原作者所有。
若本站侵犯了您的权益,请您将联系我们,我们将在第一时间及时处理。举报邮箱
如果喜欢某本书,本站鼓励购买正版小说,支持原作者的创作。
关注官方公众号
有消息第一时间通知