• 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吧

  • 相关阅读:
    练习1-6
    c语言while(1)和while(0)
    练习1-3
    每天总结模电--(三)
    每天总结模电——贴片电阻,电容的命名规则(二)
    服务器应用的通用功能
    UML
    算法合集
    python笔记
    笔面试(2019秋招阶段)
  • 原文地址:https://www.cnblogs.com/joyeecheung/p/3370534.html
Copyright © 2020-2023  润新知