Is there such a thing as min-font-size and max-font-size?

前端 未结 11 750
隐瞒了意图╮
隐瞒了意图╮ 2021-01-29 22:13

I\'m trying to make a font in a div responsive to the browser window. So far, it has worked perfectly, but the parent div has a max-width of 525px. Res

11条回答
  •  死守一世寂寞
    2021-01-29 22:32

    I got some smooth results with these. It flows smoothly between the 3 width ranges, like a continuous piecewise function.

    @media screen and (min-width: 581px) and (max-width: 1760px){
        #expandingHeader {
            line-height:5.2vw;
            font-size: 5.99vw;
        }
        #tagLine {
            letter-spacing: .15vw;
            font-size: 1.7vw;
            line-height:1.0vw;
        }
    }
    
    @media screen and (min-width: 1761px){
        #expandingHeader {
            line-height:.9em;
            font-size: 7.03em;
    
        }
        #tagLine {
            letter-spacing: .15vw;
            font-size: 1.7vw;
            line-height:1.0vw;
        }
    }
    
    @media screen and (max-width: 580px){
        #expandingHeader {
            line-height:.9em;
            font-size: 2.3em;
        }
        #tagLine {
            letter-spacing: .1em;
            font-size: .65em;
            line-height: .10em;
        }
    }
    

提交回复
热议问题