MIAC HW2
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的更多相关文章
- JAVA HW2
MODEL //yuec2 Yue Cheng package hw2; import java.io.File; import java.io.FileNotFoundException; impo ...
- Software Testing hw2
Fault的定义:可能导致系统或功能失效的异常条件(Abnormal condition that can cause an element or an item tofail.),可译为“故障”. ...
- HW2.25
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.24
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.23
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.22
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.21
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.20
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- HW2.19
public class Solution { public static void main(String[] args) { char outcome; long randomNumber; wh ...
随机推荐
- 【CF123E】Maze
Portal --> cf123E Solution 首先步数的话可以转化成每条边经过了几次这样来算 假设现在确定了起点\(S\)和终点\(T\),我们将\(T\)看成树根,那么考虑边\((u, ...
- Python之旅:装饰器
装饰器就是闭包函数的一种应用场景 一.为何要用装饰器 开放封闭原则:软件一旦上线后,就应该遵循开放封闭原则,即对修改源代码是封闭的,对功能的扩展是开放的 也就是说我们必须找到一种解决方案:能够在不修该 ...
- hihocoder 1509异或排序
描述 给定一个长度为 n 的非负整数序列 a[1..n] 你需要求有多少个非负整数 S 满足以下两个条件: (1).0 ≤ S < 2^60 (2).对于所有 1 ≤ i < n ,有 ( ...
- python学习(十六)写爬虫爬取糗事百科段子
原文链接:爬取糗事百科段子 利用前面学到的文件.正则表达式.urllib的知识,综合运用,爬取糗事百科的段子先用urllib库获取糗事百科热帖第一页的数据.并打开文件进行保存,正好可以熟悉一下之前学过 ...
- 010. C++ 传值与传引用
1.参数传递 参数传递:pass by value vs. pass by reference(to const) 推荐:能传引用,尽量传引用(高效,尤其在需要拷贝的对象很大时) class comp ...
- IOS性能调优系列:使用Time Profiler发现性能瓶颈
硬广:<IOS性能调优系列>第五篇,预计会有二十多篇,持续更新,欢迎关注. 之前四篇都是关注于内存方面,分析了内存泄漏.僵尸对象.内存分配,本篇介绍Time Profiler工具的使用,开 ...
- Bolt XML和JQBolt Lua代码自动补全插件配置教程
Bolt没有提供官方IDE,缺少强大的代码提示和自动补全,Notepad++写起界面和脚本来比较费劲. Notepad++有个QuickText插件,支持多语言的自动补全,进行简单的配置就可以支持Bo ...
- BFC 块级元素格式化上下文
Block Formatting Contexts: 块级元素格式化上下文块级元素如何对它的内容(子元素:也是一个块元素)进行布局,以及与其它元素(与内容同级别)的关系和相互作用 普通文档流的布局规则 ...
- [DeeplearningAI笔记]序列模型3.2有条件的语言模型与贪心搜索的不可行性
5.3序列模型与注意力机制 觉得有用的话,欢迎一起讨论相互学习~Follow Me 3.2选择最可能的句子 Picking the most likely sentence condition lan ...
- 782C. Andryusha and Colored Balloons DFS
Link 题意: 给出一棵树,要求为其染色,并且使任意节点都不与距离2以下的节点颜色相同 思路: 直接DFS.由某节点出发的DFS序列,对于其个儿子的cnt数+1,那么因为DFS遍历的性质可保证兄弟结 ...