关于这种 CSS 是用什么工具生成的

hebaodan · 2024-10-30 13:30:31 · 63 次点击
 <style>
html{margin:0;padding:0;box-sizing:border-box}:root{--value-max-width-page:75rem;--color-text-primary:#070a13;--color-text-secondary:#8b8b8b;--color-text-link:#070a13;--color-text-hover:#774cb2}body{font-size:18px;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Helvetica,Arial,"PingFang SC","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MDAiIGhlaWdodD0iODAwIiBvcGFjaXR5PSIuMSI+PGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSJoc2woMjYxLCA2MCUsIDM4JSkiIHN0cm9rZS13aWR0aD0iLjUiPjxwYXRoIGQ9Ik0wIDBoNjYuNjY3djY2LjY2N0gwek02Ni42NjcgMGg2Ni42Njd2NjYuNjY3SDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyAwSDIwMHY2Ni42NjdoLTY2LjY2N3pNMjAwIDBoNjYuNjY3djY2LjY2N0gyMDB6Ii8+PHBhdGggZD0iTTI2Ni42NjcgMGg2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgMEg0MDB2NjYuNjY3aC02Ni42Njd6TTQwMCAwaDY2LjY2N3Y2Ni42NjdINDAweiIvPjxwYXRoIGQ9Ik00NjYuNjY3IDBoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDBINjAwdjY2LjY2N2gtNjYuNjY3ek02MDAgMGg2Ni42Njd2NjYuNjY3SDYwMHpNNjY2LjY2NyAwaDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyAwSDgwMHY2Ni42NjdoLTY2LjY2N3pNODAwIDBoNjYuNjY3djY2LjY2N0g4MDB6TTAgNjYuNjY3aDY2LjY2N3Y2Ni42NjdIMHpNNjYuNjY3IDY2LjY2N2g2Ni42Njd2NjYuNjY3SDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyA2Ni42NjdIMjAwdjY2LjY2N2gtNjYuNjY3ek0yMDAgNjYuNjY3aDY2LjY2N3Y2Ni42NjdIMjAweiIvPjxwYXRoIGQ9Ik0yNjYuNjY3IDY2LjY2N2g2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgNjYuNjY3SDQwMHY2Ni42NjdoLTY2LjY2N3pNNDAwIDY2LjY2N2g2Ni42Njd2NjYuNjY3SDQwMHoiLz48cGF0aCBkPSJNNDY2LjY2NyA2Ni42NjdoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDY2LjY2N0g2MDB2NjYuNjY3aC02Ni42Njd6TTYwMCA2Ni42NjdoNjYuNjY3djY2LjY2N0g2MDB6TTY2Ni42NjcgNjYuNjY3aDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyA2Ni42NjdIODAwdjY2LjY2N2gtNjYuNjY3ek04MDAgNjYuNjY3aDY2LjY2N3Y2Ni42NjdIODAwek0wIDEzMy4zMzNoNjYuNjY3VjIwMEgwek02Ni42NjcgMTMzLjMzM2g2Ni42NjdWMjAwSDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyAxMzMuMzMzSDIwMFYyMDBoLTY2LjY2N3pNMjAwIDEzMy4zMzNoNjYuNjY3VjIwMEgyMDB6Ii8+PHBhdGggZD0iTTI2Ni42NjcgMTMzLjMzM2g2Ni42NjdWMjAwaC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgMTMzLjMzM0g0MDBWMjAwaC02Ni42Njd6TTQwMCAxMzMuMzMzaDY2LjY2N1YyMDBINDAweiIvPjxwYXRoIGQ9Ik00NjYuNjY3IDEzMy4zMzNoNjYuNjY3VjIwMGgtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDEzMy4zMzNINjAwVjIwMGgtNjYuNjY3ek02MDAgMTMzLjMzM2g2Ni42NjdWMjAwSDYwMHpNNjY2LjY2NyAxMzMuMzMzaDY2LjY2N1YyMDBoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyAxMzMuMzMzSDgwMFYyMDBoLTY2LjY2N3pNODAwIDEzMy4zMzNoNjYuNjY3VjIwMEg4MDB6TTAgMjAwaDY2LjY2N3Y2Ni42NjdIMHpNNjYuNjY3IDIwMGg2Ni42Njd2NjYuNjY3SDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyAyMDBIMjAwdjY2LjY2N2gtNjYuNjY3ek0yMDAgMjAwaDY2LjY2N3Y2Ni42NjdIMjAweiIvPjxwYXRoIGQ9Ik0yNjYuNjY3IDIwMGg2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgMjAwSDQwMHY2Ni42NjdoLTY2LjY2N3pNNDAwIDIwMGg2Ni42Njd2NjYuNjY3SDQwMHoiLz48cGF0aCBkPSJNNDY2LjY2NyAyMDBoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDIwMEg2MDB2NjYuNjY3aC02Ni42Njd6TTYwMCAyMDBoNjYuNjY3djY2LjY2N0g2MDB6TTY2Ni42NjcgMjAwaDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyAyMDBIODAwdjY2LjY2N2gtNjYuNjY3ek04MDAgMjAwaDY2LjY2N3Y2Ni42NjdIODAwek0wIDI2Ni42NjdoNjYuNjY3djY2LjY2N0gwek02Ni42NjcgMjY2LjY2N2g2Ni42Njd2NjYuNjY3SDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyAyNjYuNjY3SDIwMHY2Ni42NjdoLTY2LjY2N3pNMjAwIDI2Ni42NjdoNjYuNjY3djY2LjY2N0gyMDB6Ii8+PHBhdGggZD0iTTI2Ni42NjcgMjY2LjY2N2g2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgMjY2LjY2N0g0MDB2NjYuNjY3aC02Ni42Njd6TTQwMCAyNjYuNjY3aDY2LjY2N3Y2Ni42NjdINDAweiIvPjxwYXRoIGQ9Ik00NjYuNjY3IDI2Ni42NjdoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDI2Ni42NjdINjAwdjY2LjY2N2gtNjYuNjY3ek02MDAgMjY2LjY2N2g2Ni42Njd2NjYuNjY3SDYwMHpNNjY2LjY2NyAyNjYuNjY3aDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyAyNjYuNjY3SDgwMHY2Ni42NjdoLTY2LjY2N3pNODAwIDI2Ni42NjdoNjYuNjY3djY2LjY2N0g4MDB6TTAgMzMzLjMzM2g2Ni42NjdWNDAwSDB6TTY2LjY2NyAzMzMuMzMzaDY2LjY2N1Y0MDBINjYuNjY3eiIvPjxwYXRoIGQ9Ik0xMzMuMzMzIDMzMy4zMzNIMjAwVjQwMGgtNjYuNjY3ek0yMDAgMzMzLjMzM2g2Ni42NjdWNDAwSDIwMHoiLz48cGF0aCBkPSJNMjY2LjY2NyAzMzMuMzMzaDY2LjY2N1Y0MDBoLTY2LjY2N3oiLz48cGF0aCBkPSJNMzMzLjMzMyAzMzMuMzMzSDQwMFY0MDBoLTY2LjY2N3pNNDAwIDMzMy4zMzNoNjYuNjY3VjQwMEg0MDB6Ii8+PHBhdGggZD0iTTQ2Ni42NjcgMzMzLjMzM2g2Ni42NjdWNDAwaC02Ni42Njd6Ii8+PHBhdGggZD0iTTUzMy4zMzMgMzMzLjMzM0g2MDBWNDAwaC02Ni42Njd6TTYwMCAzMzMuMzMzaDY2LjY2N1Y0MDBINjAwek02NjYuNjY3IDMzMy4zMzNoNjYuNjY3VjQwMGgtNjYuNjY3eiIvPjxwYXRoIGQ9Ik03MzMuMzMzIDMzMy4zMzNIODAwVjQwMGgtNjYuNjY3ek04MDAgMzMzLjMzM2g2Ni42NjdWNDAwSDgwMHpNMCA0MDBoNjYuNjY3djY2LjY2N0gwek02Ni42NjcgNDAwaDY2LjY2N3Y2Ni42NjdINjYuNjY3eiIvPjxwYXRoIGQ9Ik0xMzMuMzMzIDQwMEgyMDB2NjYuNjY3aC02Ni42Njd6TTIwMCA0MDBoNjYuNjY3djY2LjY2N0gyMDB6Ii8+PHBhdGggZD0iTTI2Ni42NjcgNDAwaDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNMzMzLjMzMyA0MDBINDAwdjY2LjY2N2gtNjYuNjY3ek00MDAgNDAwaDY2LjY2N3Y2Ni42NjdINDAweiIvPjxwYXRoIGQ9Ik00NjYuNjY3IDQwMGg2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTUzMy4zMzMgNDAwSDYwMHY2Ni42NjdoLTY2LjY2N3pNNjAwIDQwMGg2Ni42Njd2NjYuNjY3SDYwMHpNNjY2LjY2NyA0MDBoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik03MzMuMzMzIDQwMEg4MDB2NjYuNjY3aC02Ni42Njd6TTgwMCA0MDBoNjYuNjY3djY2LjY2N0g4MDB6TTAgNDY2LjY2N2g2Ni42Njd2NjYuNjY3SDB6TTY2LjY2NyA0NjYuNjY3aDY2LjY2N3Y2Ni42NjdINjYuNjY3eiIvPjxwYXRoIGQ9Ik0xMzMuMzMzIDQ2Ni42NjdIMjAwdjY2LjY2N2gtNjYuNjY3ek0yMDAgNDY2LjY2N2g2Ni42Njd2NjYuNjY3SDIwMHoiLz48cGF0aCBkPSJNMjY2LjY2NyA0NjYuNjY3aDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNMzMzLjMzMyA0NjYuNjY3SDQwMHY2Ni42NjdoLTY2LjY2N3pNNDAwIDQ2Ni42NjdoNjYuNjY3djY2LjY2N0g0MDB6Ii8+PHBhdGggZD0iTTQ2Ni42NjcgNDY2LjY2N2g2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTUzMy4zMzMgNDY2LjY2N0g2MDB2NjYuNjY3aC02Ni42Njd6TTYwMCA0NjYuNjY3aDY2LjY2N3Y2Ni42NjdINjAwek02NjYuNjY3IDQ2Ni42NjdoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik03MzMuMzMzIDQ2Ni42NjdIODAwdjY2LjY2N2gtNjYuNjY3ek04MDAgNDY2LjY2N2g2Ni42Njd2NjYuNjY3SDgwMHpNMCA1MzMuMzMzaDY2LjY2N1Y2MDBIMHpNNjYuNjY3IDUzMy4zMzNoNjYuNjY3VjYwMEg2Ni42Njd6Ii8+PHBhdGggZD0iTTEzMy4zMzMgNTMzLjMzM0gyMDBWNjAwaC02Ni42Njd6TTIwMCA1MzMuMzMzaDY2LjY2N1Y2MDBIMjAweiIvPjxwYXRoIGQ9Ik0yNjYuNjY3IDUzMy4zMzNoNjYuNjY3VjYwMGgtNjYuNjY3eiIvPjxwYXRoIGQ9Ik0zMzMuMzMzIDUzMy4zMzNINDAwVjYwMGgtNjYuNjY3ek00MDAgNTMzLjMzM2g2Ni42NjdWNjAwSDQwMHoiLz48cGF0aCBkPSJNNDY2LjY2NyA1MzMuMzMzaDY2LjY2N1Y2MDBoLTY2LjY2N3oiLz48cGF0aCBkPSJNNTMzLjMzMyA1MzMuMzMzSDYwMFY2MDBoLTY2LjY2N3pNNjAwIDUzMy4zMzNoNjYuNjY3VjYwMEg2MDB6TTY2Ni42NjcgNTMzLjMzM2g2Ni42NjdWNjAwaC02Ni42Njd6Ii8+PHBhdGggZD0iTTczMy4zMzMgNTMzLjMzM0g4MDBWNjAwaC02Ni42Njd6TTgwMCA1MzMuMzMzaDY2LjY2N1Y2MDBIODAwek0wIDYwMGg2Ni42Njd2NjYuNjY3SDB6TTY2LjY2NyA2MDBoNjYuNjY3djY2LjY2N0g2Ni42Njd6Ii8+PHBhdGggZD0iTTEzMy4zMzMgNjAwSDIwMHY2Ni42NjdoLTY2LjY2N3pNMjAwIDYwMGg2Ni42Njd2NjYuNjY3SDIwMHoiLz48cGF0aCBkPSJNMjY2LjY2NyA2MDBoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik0zMzMuMzMzIDYwMEg0MDB2NjYuNjY3aC02Ni42Njd6TTQwMCA2MDBoNjYuNjY3djY2LjY2N0g0MDB6Ii8+PHBhdGggZD0iTTQ2Ni42NjcgNjAwaDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNTMzLjMzMyA2MDBINjAwdjY2LjY2N2gtNjYuNjY3ek02MDAgNjAwaDY2LjY2N3Y2Ni42NjdINjAwek02NjYuNjY3IDYwMGg2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTczMy4zMzMgNjAwSDgwMHY2Ni42NjdoLTY2LjY2N3pNODAwIDYwMGg2Ni42Njd2NjYuNjY3SDgwMHpNMCA2NjYuNjY3aDY2LjY2N3Y2Ni42NjdIMHpNNjYuNjY3IDY2Ni42NjdoNjYuNjY3djY2LjY2N0g2Ni42Njd6Ii8+PHBhdGggZD0iTTEzMy4zMzMgNjY2LjY2N0gyMDB2NjYuNjY3aC02Ni42Njd6TTIwMCA2NjYuNjY3aDY2LjY2N3Y2Ni42NjdIMjAweiIvPjxwYXRoIGQ9Ik0yNjYuNjY3IDY2Ni42NjdoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik0zMzMuMzMzIDY2Ni42NjdINDAwdjY2LjY2N2gtNjYuNjY3ek00MDAgNjY2LjY2N2g2Ni42Njd2NjYuNjY3SDQwMHoiLz48cGF0aCBkPSJNNDY2LjY2NyA2NjYuNjY3aDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNTMzLjMzMyA2NjYuNjY3SDYwMHY2Ni42NjdoLTY2LjY2N3pNNjAwIDY2Ni42NjdoNjYuNjY3djY2LjY2N0g2MDB6TTY2Ni42NjcgNjY2LjY2N2g2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTczMy4zMzMgNjY2LjY2N0g4MDB2NjYuNjY3aC02Ni42Njd6TTgwMCA2NjYuNjY3aDY2LjY2N3Y2Ni42NjdIODAwek0wIDczMy4zMzNoNjYuNjY3VjgwMEgwek02Ni42NjcgNzMzLjMzM2g2Ni42NjdWODAwSDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyA3MzMuMzMzSDIwMFY4MDBoLTY2LjY2N3pNMjAwIDczMy4zMzNoNjYuNjY3VjgwMEgyMDB6Ii8+PHBhdGggZD0iTTI2Ni42NjcgNzMzLjMzM2g2Ni42NjdWODAwaC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgNzMzLjMzM0g0MDBWODAwaC02Ni42Njd6TTQwMCA3MzMuMzMzaDY2LjY2N1Y4MDBINDAweiIvPjxwYXRoIGQ9Ik00NjYuNjY3IDczMy4zMzNoNjYuNjY3VjgwMGgtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDczMy4zMzNINjAwVjgwMGgtNjYuNjY3ek02MDAgNzMzLjMzM2g2Ni42NjdWODAwSDYwMHpNNjY2LjY2NyA3MzMuMzMzaDY2LjY2N1Y4MDBoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyA3MzMuMzMzSDgwMFY4MDBoLTY2LjY2N3pNODAwIDczMy4zMzNoNjYuNjY3VjgwMEg4MDB6TTAgODAwaDY2LjY2N3Y2Ni42NjdIMHpNNjYuNjY3IDgwMGg2Ni42Njd2NjYuNjY3SDY2LjY2N3oiLz48cGF0aCBkPSJNMTMzLjMzMyA4MDBIMjAwdjY2LjY2N2gtNjYuNjY3ek0yMDAgODAwaDY2LjY2N3Y2Ni42NjdIMjAweiIvPjxwYXRoIGQ9Ik0yNjYuNjY3IDgwMGg2Ni42Njd2NjYuNjY3aC02Ni42Njd6Ii8+PHBhdGggZD0iTTMzMy4zMzMgODAwSDQwMHY2Ni42NjdoLTY2LjY2N3pNNDAwIDgwMGg2Ni42Njd2NjYuNjY3SDQwMHoiLz48cGF0aCBkPSJNNDY2LjY2NyA4MDBoNjYuNjY3djY2LjY2N2gtNjYuNjY3eiIvPjxwYXRoIGQ9Ik01MzMuMzMzIDgwMEg2MDB2NjYuNjY3aC02Ni42Njd6TTYwMCA4MDBoNjYuNjY3djY2LjY2N0g2MDB6TTY2Ni42NjcgODAwaDY2LjY2N3Y2Ni42NjdoLTY2LjY2N3oiLz48cGF0aCBkPSJNNzMzLjMzMyA4MDBIODAwdjY2LjY2N2gtNjYuNjY3ek04MDAgODAwaDY2LjY2N3Y2Ni42NjdIODAweiIvPjwvZz48L3N2Zz4=);background-repeat:repeat;background-size:300px 300px;display:flex;flex-direction:column;min-height:95vh}a{color:var(--color-text-link);text-decoration:none}a:link{color:var(--color-text-link)}a:visited{color:var(--color-text-link)}a:hover{color:var(--color-text-hover);text-decoration:none}a:active{color:var(--color-text-hover)}svg{margin-right:5px;vertical-align:middle}.container{max-width:var(--value-max-width-page);max-width:24rem;margin:0 auto}@media (min-width:24.5rem){.container{max-width:43.5rem}}@media (min-width:44rem){.container{max-width:63rem}}.title{font-size:larger;font-size:2.5rem;line-height:1;font-weight:700;margin:3rem}.selfed{display:block}.selfed li{border-radius:12px;display:inline-block;border:2px #ddd solid;margin-bottom:.6rem;margin-right:.5rem}.selfed li a{list-style:none;display:flex;align-items:center;justify-content:left;min-width:15rem;padding:1.5rem 1.8rem}.selfed li:hover{border-color:#e4dbf0;background-color:rgba(244,241,249,.4)}.selfed li:hover a,.selfed li:hover svg{color:var(--color-text-hover)}footer{display:flex;flex:1;align-items:end;justify-content:center}footer div{font-size:medium;color:var(--color-text-secondary)}.telegram path{fill:var(--color-text-secondary)}.telegram:hover path{fill:var(--color-text-hover)}
</style>
举报· 63 次点击
登录 注册 站外分享
4 条回复  
zhong_little 初学 2024-10-30 13:30:31

这就是把图片转成 base64 压进 css 里了

anghunk 初学 2024-10-30 13:30:31

这就是一串简单的 css 呀,你指的是哪方面?压缩格式还是什么


大致看了一下应该是手写的,经过压缩后的

返回顶部