收藏
PHPz批改状态：合格
老师批语：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><!-- <link rel="stylesheet" href="../static/icon_font/font_3316062_x29n1h5chbq/iconfont.css"> --><link rel="stylesheet" href="../static/5-3.css"><title>字体图标</title></head><body><div><span class="iconfont icon-gouwuchekong"></span></div></body></html>
@import "../static/icon_font/font_icon1/iconfont.css";.iconfont.icon-gouwuchekong{font-size: 17px;color: green;}
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="stylesheet" href="../static/字体图标与媒体查询示例2.css"><title>媒体查询2</title></head><body><button class="btn samll">btn1</button><button class="btn middle">btn2</button><button class="btn large">btn3</button></body></html>
html{font-size: 10px;}.btn{background-color: green;color: white;border: none;outline: none;}.btn:hover{cursor: pointer;opacity: 0.8;transition: 0.5s;padding: 0.4rem 0.8rem;}.btn.small{font-size: 1.2rem;}.btn.middle{font-size: 1.6rem;}.btn.large{font-size: 1.8rem;}/* *当小于374时生效(使字体大一点) */@media(max-width:374px){html{font-size: 12px;}}/* *375-414px之间 */@media(min-width:375px)and(max-width:413px){html{font-size: 14px;}}/* *414px以上空间 */@media(min-width:414px){html{font-size: 16px;}}/* *以上是由小到大叫移动优先 *//* *如果是由大到小叫pc优先 */
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
