MIAC的第二次作业,翻了一些fashion网站找了点灵感,重新设计了一下UI。

因为给的html里有nav之类的HTML5新特性,所以索性就不管IE的兼容了。chrome下的效果:

FF下也差不多。这次作业试用了一下google font,果然好用(虽然载入速度不快&没中文),本来想用Raleway的extra light做h2字体的,发现chrome居然渲染不出它的extra light(FF正常),最后选了Josephin Sans。

其他的收获:

1. fashion网站都爱黑白配,真的,满眼黑白配,最多再加一种颜色(比如经典的红色,logo里的颜色),然后用些带感的字体,loads of 带感图片,配上清爽的layout,et voila,一个fashion站子出来了……这个规律适用于杂志,品牌,门户,lookbook这样的SNS等等各种网站……另外,标题他们会比较偏爱用serif,当然肯定不会是Times,通常是typography里归类到Modern的那些,分得更细一点那就是Didone(Didot/Bodoni,奢侈品牌的最爱=。=)

2.如果直接用<button>的话,似乎不能做背景透明……浏览器自带的button样式一般毫无style可言,所以button的CSS一般写得比较复杂(因为默认太丑都要推倒重来……),这次作业用的是:

button.comment-submit {
font-size: 14px;
font-weight: bold;
background-color: #151515;
color: #FFFFFF;
text-shadow: none;
margin-top: 10px;
cursor: pointer;
float: right;
text-align: center;
padding: 5px 20px 5px 20px;
border: 2px solid #BBBBBB;
border-radius: 30px;
margin-right: 30px;
} button.comment-submit:link {
border-style: none;
} button.comment-submit:active {
border-style: inset;
}

P.S. 如果想弄个好看的按钮还要兼容天杀的低版本IE……果断还是用图片吧……

完整代码在:

https://github.com/joyeec9h3/WebHWs/tree/master/MIAC/my-gallery

依然还没开始进入JS的世界 T__T 努力看JQuery吧

MIAC HW2的更多相关文章

  1. JAVA HW2

    MODEL //yuec2 Yue Cheng package hw2; import java.io.File; import java.io.FileNotFoundException; impo ...

  2. Software Testing hw2

    Fault的定义:可能导致系统或功能失效的异常条件(Abnormal condition that can cause an element or an item tofail.),可译为“故障”. ...

  3. HW2.25

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  4. HW2.24

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  5. HW2.23

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  6. HW2.22

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  7. HW2.21

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  8. HW2.20

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  9. HW2.19

    public class Solution { public static void main(String[] args) { char outcome; long randomNumber; wh ...

随机推荐

  1. Project Euler 453 Lattice Quadrilaterals 困难的计数问题

    这是一道很综合的计数问题,对于思维的全面性,解法的过渡性,代码能力,细节处理,计数问题中的各种算法,像gcd.容斥.类欧几里德算法都有考察.在省选模拟赛中做到了这题,然而数据范围是n,m小于等于100 ...

  2. jq从数组中删除指定元素(根据自定义条件) 超好用的 $.grep() 方法

    转: jQuery.grep() 什么是jQuery.grep()? jQuery.grep()是一个查找满足过滤函数的数组元素的函数.原始数组不受影响,返回值为数组. 用法介绍: 写法: jQuer ...

  3. Java--Inheritance constructor继承中的构造方法问题(二)

    看了前辈的博客,觉得这两点说的精辟:子类构造方法必须要调用父类的某个构造方法:被子类调用的父类构造方法在父类中必须是存在的. 上篇的例子有一点不明白,子类继承了父类的成员变量,父类的构造函数里引用了该 ...

  4. 数据压缩算法之哈夫曼编码(HUFFMAN)的实现

    HUFFMAN编码可以很有效的压缩数据,通常可以压缩20%到90%的空间(算法导论).具体的压缩率取决于数据的特性(词频).如果采取标准的语料库进行编码,一般可以得到比较满意的编码结果(对不同文件产生 ...

  5. Python使用redis介绍

    一.Redis的介绍 redis是业界主流的key-value nosql 数据库之一.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).se ...

  6. golang channel状态表

    如果我们查看该表,可以察觉到在操作中可能产生问题的地方.这里有三个可能导致阻塞的操作,以及三 个可能导致程序恐慌的操作. 乍看之下,通道的使用上限制很多,但在检查了这个限制产生的动机并熟悉 了通道的使 ...

  7. MySQL下创建序列及创建自定义函数方法介绍

    工作过程中需要将基于DB2数据库的应用以及数据迁移到MySQL中去,在原应用中,大量使用了SEQUENCE,考虑尽量减少代码的修改,决定在迁移后的应用中继续保留SEQUENCE的使用,这就要求在MyS ...

  8. java格式化字符串,在指定位置插入指定字符串,兼容中英文以及特殊字符,例如:换行,用于解决生成pdf换行问题等问题

    本博客是自己在学习和工作途中的积累与总结,仅供自己参考,也欢迎大家转载,转载时请注明出处.  http://www.cnblogs.com/king-xg/p/6370890.html 如果觉得对您有 ...

  9. Lucene 查询分页技术

    常用的Lucene查询代码如下所示,该代码的作用是将path路径下的所有索引信息返回 public String matchAll(String path) { try { Directory dir ...

  10. Docker 配置国内镜像拉取中心,Configure docker to use faster registries in China.

    Networking in China is really bad when it comes to using some cloud based tools like docker, it's us ...