收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
楼主: nealyo

[技术相关] 赚取专家分,增加点难度:用纯代码写一个蓝色理想的logo?(带字符)

  [复制链接]
发表于 2012-1-5 12:30:04 | 显示全部楼层
凌志 发表于 2012-1-5 11:39
[html]

终于看到3个DIV的了
回复

使用道具 举报

发表于 2012-1-5 12:30:18 | 显示全部楼层
小志的牛。
回复

使用道具 举报

发表于 2012-1-5 12:31:42 | 显示全部楼层
phantom 发表于 2012-1-5 11:51
[html]

看到2个DIV了
回复

使用道具 举报

发表于 2012-1-5 12:38:31 | 显示全部楼层
29L的代码看起来是用script,本质其实是css和div哦。。。只是因为原本的 css+div 太大了,所以用 JS 压缩了一下

再来一个 BT 版本 的:

 提示:您可以先修改部分代码再运行

回复

使用道具 举报

发表于 2012-1-5 12:39:22 | 显示全部楼层
phantom 发表于 2012-1-5 11:51
[html]

2个DIV。好牛
回复

使用道具 举报

发表于 2012-1-5 12:43:24 | 显示全部楼层
hutia 发表于 2012-1-5 12:20
NND 内容太长就发不上来了。。。改了改。。。

[html]

好创意,颜色怎么取到的?逐点扫描?
回复

使用道具 举报

发表于 2012-1-5 12:50:19 | 显示全部楼层
一个DIV也行,还用2个,或者不用DIV也可以
回复

使用道具 举报

发表于 2012-1-5 13:11:42 | 显示全部楼层
再来一个只用两个div的方法,可惜就是兼容性不太好,IE 的 Quiz 模式下看起来很糟糕

 提示:您可以先修改部分代码再运行








代码很精简,思路很新颖,可惜还有带完善,我在FF下看也不行
回复

使用道具 举报

发表于 2012-1-5 13:12:55 | 显示全部楼层
yydyao 发表于 2012-1-5 12:43
好创意,颜色怎么取到的?逐点扫描?

Canvas 的 getImageData,呵呵。做了个转换器
回复

使用道具 举报

发表于 2012-1-5 13:17:38 | 显示全部楼层
hutia 发表于 2012-1-5 13:11
再来一个只用两个div的方法,可惜就是兼容性不太好,IE 的 Quiz 模式下看起来很糟糕

[html]

哥谷歌好像有点问题
回复

使用道具 举报

发表于 2012-1-5 13:20:27 | 显示全部楼层
hellocookies 发表于 2012-1-5 12:50
一个DIV也行,还用2个,或者不用DIV也可以

哪你至少得用个标签吧
回复

使用道具 举报

发表于 2012-1-5 13:22:03 | 显示全部楼层
jiushimajia 发表于 2012-1-5 13:20
哪你至少得用个标签吧

看我33L的就木有标签
回复

使用道具 举报

发表于 2012-1-5 13:25:40 | 显示全部楼层
hutia 发表于 2012-1-5 13:22
看我33L的就木有标签


script是标签吗
回复

使用道具 举报

发表于 2012-1-5 13:26:52 | 显示全部楼层
hutia 发表于 2012-1-5 13:22
看我33L的就木有标签

 提示:您可以先修改部分代码再运行



骗子……大骗子啊,这个明明就是img标签……如果这样可以的话,那直接body:before和body:after,也是没用标签哦。反正body是必要标签,其他就没增加多余的标签了。
回复

使用道具 举报

发表于 2012-1-5 13:27:15 | 显示全部楼层
jiushimajia 发表于 2012-1-5 13:25
script是标签吗

那个只是为了演示用的,你直接把后面的字符串输在浏览器地址栏效果是一样的,嘿嘿
回复

使用道具 举报

发表于 2012-1-5 13:30:59 | 显示全部楼层

 提示:您可以先修改部分代码再运行



table最适合这个框框的样子,兼容也最好,为啥都没人用~~~是不是都是入前端行业就直接上的div css?


回复

使用道具 举报

发表于 2012-1-5 13:43:20 | 显示全部楼层

 提示:您可以先修改部分代码再运行



哦,原来得点那个“我来回答”才行。这个和回复也没区别啊。
回复

使用道具 举报

发表于 2012-1-5 13:44:09 | 显示全部楼层
本帖最后由 hutia 于 2012-1-5 13:48 编辑

用 dl, dt, dd 来做的,结构类似于 4楼, 但是没有像他那样用 position 定位,而是用了 float

 提示:您可以先修改部分代码再运行




======分隔=======

在Opera里还能看,IE Quiz模式不行。。。看来对兼容性还是不够精通啊
回复

使用道具 举报

发表于 2012-1-5 13:44:12 | 显示全部楼层
jiushimajia 发表于 2012-1-5 12:30
终于看到3个DIV的了

小志是2个啊。
回复

使用道具 举报

发表于 2012-1-5 13:47:33 | 显示全部楼层
landiaozi15 发表于 2012-1-5 13:30
[html]
.tb {background:#333;width:60px;height:40px}
.td1 {background:#00FF99}

我开始也用的table,不过你试试做小一点,和实际标志一样大的,就不好弄了。
回复

使用道具 举报

发表于 2012-1-5 14:07:48 | 显示全部楼层
哈哈,新人表示小志的代码看不懂
回复

使用道具 举报

发表于 2012-1-5 14:13:35 | 显示全部楼层
小志的比较巧妙。一个外框+左边那条黑色线各做一个DIV, 黑色的上下两种颜色都以border设置。
回复

使用道具 举报

发表于 2012-1-5 14:32:47 | 显示全部楼层
凌志 发表于 2012-1-5 13:47
我开始也用的table,不过你试试做小一点,和实际标志一样大的,就不好弄了。

 提示:您可以先修改部分代码再运行



额……表格的确是一个蛋痛的事情,高度宽度不好控制啊。嘻嘻。顺带加一个小动画玩玩。
回复

使用道具 举报

发表于 2012-1-5 14:43:12 | 显示全部楼层
包含 logo 和文字的强力压缩完整版

 提示:您可以先修改部分代码再运行

评分

参与人数 1威望 +1 收起 理由
nealyo + 1 这个很猛,新思路,不过颜色在FF下支持不好

查看全部评分

回复

使用道具 举报

发表于 2012-1-5 14:50:09 | 显示全部楼层

 提示:您可以先修改部分代码再运行

回复

使用道具 举报

发表于 2012-1-5 14:55:07 | 显示全部楼层
flash120 发表于 2012-1-5 14:50
[html]

我的logo有文字,这才叫完整啊!
回复

使用道具 举报

发表于 2012-1-5 16:45:57 | 显示全部楼层

 提示:您可以先修改部分代码再运行



你们不要笑我哈








第一个用CSS写出来的带字符的,潜力楼层,支持一下。
回复

使用道具 举报

发表于 2012-1-5 16:52:26 | 显示全部楼层
phantom 发表于 2012-1-5 14:32
[html]

哈,这个帖子的氛围让我想起了六七年前的经典论坛。
回复

使用道具 举报

发表于 2012-1-5 16:59:34 | 显示全部楼层
shuangyulei 发表于 2012-1-5 16:45
[html]

你这个不错!不过再给下面加排英文就完美了~
回复

使用道具 举报

发表于 2012-1-5 17:24:20 | 显示全部楼层

 提示:您可以先修改部分代码再运行

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( ICP05002321 )  

GMT+8, 2019-12-6 05:56 , Processed in 0.125659 second(s), 11 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表