追忆中国站长黄金年代 （上）：起源与第一批站长——从拨号"猫"的握手声，到第一代个人站长赚到第一桶金
<div class="ce-block" data-id="FJtx_uzCPH" ><div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">一、什么是"站长"？—— 一个时代的称呼</h3>
</div>
</div><div class="ce-block ce-block--focused" data-id="qrqalDPJxd" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">今天说起"站长"，年轻人想到的可能是小区物业站长、快递站点负责人；但在 1997 到 2010 年间的中文互联网里，"站长"是一个自带光环的词：它指那些拥有并管理一个网站的人，通常还是"个人网站"的站长——自己写 HTML、自己传文件、自己维护服务器，一个人就是一支队伍。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="JdP4bTVSsO" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">这个称呼的来源，与早期"个人主页"时代密切相关。那时没有微博、没有公众号、没有抖音，网民要展示自己，只有两个地方：个人主页和BBS 论坛。于是"站长"（管网站的人）与"版主"（管论坛版面的人）一起，成了互联网世界最早的一批"民间头衔"。1997 年到 1999 年，正是个人主页的第一个黄金时代，也是"站长"这个词开始流行的年代。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="LQaDdROAJK" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">1997 年，一些网络爱好者们开始做自己的个人主页。从 1997 年初到 1998 年上半年，网易个人主页空间，对推动个人主页发展发挥了重要作用。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="ZY1bbAJsNT" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">—— 创业邦《并未消逝的个人站长》 [来源]</div>
</div>
</div><div class="ce-block" data-id="1IHexGeWbR" >
<div class="ce-block__content" style="">
<h4 class="ce-header ce-header--left">上篇时间轴：1997 — 2004</h4>
</div>
</div><div class="ce-block ce-block--focused" data-id="r9ipRbzZt2" >
<div class="ce-block__content">
<ul class="cdx-list-unordered"><li class="cdx-list__item">1997：个人主页元年，网络爱好者开始制作个人主页；网易推出免费个人主页空间，推动浪潮。</li><li class="cdx-list__item">1998-1999：第一批个人站长靠国外点击广告月入数千美元（如李兴平）；高春辉进入金山、Carboy 进入飞华。</li><li class="cdx-list__item">1999：广州飞华 Supercool 上线，申请首日挤瘫广州视窗与 163 电子邮局，数月用户超 20 万。</li><li class="cdx-list__item">2000：互联网泡沫破灭，免费个人主页纷纷关闭或限流，个人网站进入"黑暗期"。</li><li class="cdx-list__item">2001.3：网易个人主页开始收费，到 2002 年 8 月全面收费，留下的用户不到 5%。</li><li class="cdx-list__item">2002.8：网易第一家开通短信联盟，新浪、搜狐随后跟进，"短信联盟"成为站长新收入。</li><li class="cdx-list__item">2003-2004：SP 短信联盟 + 淘宝/EBAY 支撑个人站点，hao123 月入 80 万+、2004 年被百度收购。</li></ul>
</div>
</div><div class="ce-block" data-id="eX6Sn9UeVX" >
<div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">二、第一批站长：网易与飞华掀起的个人主页浪潮</h3>
</div>
</div><div class="ce-block ce-block--focused" data-id="gdrr8GV4U7" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">网易是个人主页浪潮最重要的推手。1997 年初到 1998 年上半年，网易个人主页空间"对推动个人主页发展发挥了重要作用"。它的免费空间有 20MB，还配了留言板、计数器等配套服务，"推出后即大受欢迎，不同题材个人主页百花齐放"。当时大部分中文互联网信息都来自个人主页——"个人主页就是中国互联网的代名词，而网易就是中国个人主页的代名词"。 [来源：CSDN 中国个人主页发展简史]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="z75hEaSZYD" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">到了 1999 年初，广州飞华推出 Supercool 免费个人主页服务："在接受申请的第一天，因为访问人数太多，使得放置了申请入口的广州视窗、163 电子邮局等网站几近瘫痪；并且在短短几个月时间内，便拥有超过二十万用户，超过了网易，成为当时全国最大的个人主页基地。" [来源：CSDN 中国个人主页发展简史]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="2Tmaj0mN3T" >
<div class="ce-block__content">
<div class="cdx-block image-tool image-tool--filled ">
<div class="image-tool__image">
<div class="image-tool__image-preloader" style=""></div>
<img id="aimg_2Tmaj0mN3T" class="image-tool__image-picture _zoom" src="https://idceve.com/data/attachment/forum/202610/14/095235a6rcu4wh11pzuh2w.png" title=" 图：1990 年代 Packard Bell 多媒体电脑（真实照片，Wikimedia Commons） " alt=" 图：1990 年代 Packard Bell 多媒体电脑（真实照片，Wikimedia Commons） " data-aid="195"/>
</div>
<div class="cdx-input image-tool__caption" data-placeholder=" 图：1990 年代 Packard Bell 多媒体电脑（真实照片，Wikimedia Commons） "> 图：1990 年代 Packard Bell 多媒体电脑（真实照片，Wikimedia Commons） </div>
</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="oche1EGtjg" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">那个年代，许多今天互联网圈的"老人"都是从这里起步的。CSDN 的简史里专门记了两个人："完全上网手册"的 Carboy 进入飞华、"高春辉的个人主页"的高春辉进入金山，"都是当年比较有名的事件"。第一代站长把个人主页做成了作品，也把自己做成了互联网公司争抢的人才。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="br3bgTPUlp" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">更重要的是，第一批站长真的赚到了钱。创业邦的简史写道：1998 年、1999 年，第一批个人站长依靠做国外的点击广告赚到了钱，包括李兴平等，一个月最高能赚到几千美元。在月薪普遍只有几百上千元的年代，几千美元的月收入堪称"天文数字"，这也是"站长能赚钱"这件事第一次被中国互联网记住。 [来源：创业邦]</div>
</div>
</div><div class="ce-block" data-id="-dzTld7glR" >
<div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">三、2000 年泡沫破灭：免费午餐结束</h3>
</div>
</div><div class="ce-block ce-block--focused" data-id="dUD8oHgijL" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">2000 年初，全球互联网泡沫破灭。CSDN 简史记载："互联网泡沫经济破灭，连带很多免费个人主页服务纷纷关闭或只提供有限度的服务。很多原本很有名气的主页都在这个时期给清洗掉。而人们找不到合适的个人主页服务，个人主页从此走入了最"惨淡"的年代。" [来源：CSDN]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="vjJLh_EfP8" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">随后是收费潮。2001 年 3 月，网易个人主页树起收费大旗，到 2002 年 8 月实施全面收费。"因为人们还不习惯互联网的收费服务，又经历过用户主页域名的修改风波，实际上网易的个人主页用户已经大大减少，留下来的用户不到 5%。" [来源：CSDN]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="bqTVTqB_eM" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">免费个人主页模式的落幕，逼着站长们开始想一件事：网站到底怎么养活自己？很快，一个充满草根气质的答案出现了——短信联盟。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="P7NJ48XynD" >
<div class="ce-block__content">
<div class="cdx-block image-tool image-tool--filled ">
<div class="image-tool__image">
<div class="image-tool__image-preloader" style=""></div>
<img id="aimg_P7NJ48XynD" class="image-tool__image-picture _zoom" src="https://idceve.com/data/attachment/forum/202610/14/095305ws35ztaz4m6jmd5s.png" title=" 图：90 年代 Netscape Navigator 浏览器界面（真实截图，Wikimedia Commons） " alt=" 图：90 年代 Netscape Navigator 浏览器界面（真实截图，Wikimedia Commons） " data-aid="196"/>
</div>
<div class="cdx-input image-tool__caption" data-placeholder=" 图：90 年代 Netscape Navigator 浏览器界面（真实截图，Wikimedia Commons） "> 图：90 年代 Netscape Navigator 浏览器界面（真实截图，Wikimedia Commons） </div>
</div>
</div>
</div><div class="ce-block" data-id="ZrlqlGyIeM" >
<div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">四、2002-2004：短信联盟与 SP 时代</h3>
</div>
</div><div class="ce-block ce-block--focused" data-id="D7lNLT06Uj" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">2002 年 8 月，网易第一家开通了短信联盟，接下来是新浪、搜狐。创业邦简史这样总结站长们的收入史："2002 至 2003 年，个人站长可以从短信联盟中赚钱。2003 年至 2004 年，支撑个人站点发展的大部分是 SP 的短信联盟，还有 EBAY 和淘宝。" [来源：创业邦]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="OkOLWqBBJL" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">所谓"短信联盟"，本质是：站长在自己的网站放上订阅短信、下载铃声图铃的入口，用户付费后站长按效果分成。那两年"彩铃""手机图片""短信笑话"漫天飞，无数小网站靠"卖短信"活了下来，也养出了第一批真正靠网站吃饭的站长。与此同时，淘宝与 EBAY 的 C2C 广告分成也开始出现在个人网站上——中文互联网最草根的商业模式，在那个年代野蛮生长。</div>
</div>
</div><div class="ce-block" data-id="W2RHOKGVxq" >
<div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">五、第一批站长代表案例：从网吧管理员到互联网传奇</h3>
</div>
</div><div class="ce-block" data-id="C5q7MhFAcp" >
<div class="ce-block__content" style="">
<h4 class="ce-header ce-header--left">hao123 创始人 李兴平 —— 初中未毕业的"网址导航之王"</h4>
</div>
</div><div class="ce-block ce-block--focused" data-id="TZMilJE9gI" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">1979 年生于广东梅州兴宁。初中未毕业就进入社会，因为热爱网络游戏，在兴宁一家网吧找了份网吧管理员的工作。为了帮人装电脑查配件报价，他上网找资料非常困难——"当时的中文网站不仅内容不够丰富，数量有限，而且要把那些用英文字母表示的网址一个个记下来，并不是一件容易的事情"。于是他干脆做了一个网页，把自己认为好的网站收集起来并建立链接——这就是 hao123 的雏形。 [来源：今日头条] [来源：百度百科]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="fnHLppWro6" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">1999 年 8 月，hao123 导航网站正式上线。它"很好地契合了中国互联网用户的现实需求：被大公司所忽略的初级网民市场"。2003-2004 年，hao123 月入超过 80 万元，年入上千万。 [来源：4414 网传站长榜，供怀旧参考]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="DQNqeboldg" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">2004 年，百度以 1190 万现金 + 4 万股百度股票收购 hao123（合计约 5000 万）。李彦宏评价它："正是由于它的简单，简单到你无法去超越它。" 此后李兴平还运营了 4399 小游戏等品牌，成为梅州互联网从业者眼中的"教父级"人物。 [来源：今日头条] [来源：百度百科]</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="Zsgyy_x_pW" >
<div class="ce-block__content">
<div class="cdx-block image-tool image-tool--filled ">
<div class="image-tool__image">
<div class="image-tool__image-preloader" style=""></div>
<img id="aimg_Zsgyy_x_pW" class="image-tool__image-picture _zoom" src="https://idceve.com/data/attachment/forum/202610/14/095327xav3coyc9ttos99k.png" title=" 图：Internet Explorer 6 浏览器界面（真实截图，Wikimedia Commons） " alt=" 图：Internet Explorer 6 浏览器界面（真实截图，Wikimedia Commons） " data-aid="197"/>
</div>
<div class="cdx-input image-tool__caption" data-placeholder=" 图：Internet Explorer 6 浏览器界面（真实截图，Wikimedia Commons） "> 图：Internet Explorer 6 浏览器界面（真实截图，Wikimedia Commons） </div>
</div>
</div>
</div><div class="ce-block" data-id="c25tGlSefs" >
<div class="ce-block__content" style="">
<h4 class="ce-header ce-header--left">高春辉 —— "高春辉的个人主页"与金山</h4>
</div>
</div><div class="ce-block ce-block--focused" data-id="kc3nW7FdXA" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">1998 年前后，高春辉的个人主页是国内最著名的个人网站之一，以软件下载与个人分享闻名。他的主页做得极好，成为那个年代"个人主页也能做成事业"的样本。1999 年底，正值全球互联网经济高峰，国内好几个著名个人主页被 ICP 收购，"高春辉的个人主页"的高春辉进入金山，成为"个人站长从游击队成为正规军"的标志性事件。 [来源：CSDN 中国个人主页发展简史]</div>
</div>
</div><div class="ce-block" data-id="CzYG4guW7G" >
<div class="ce-block__content" style="">
<h4 class="ce-header ce-header--left">Carboy（杨震霆） —— "完全上网手册"与飞华</h4>
</div>
</div><div class="ce-block ce-block--focused" data-id="jtPZ6gmKbl" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">Carboy 的"完全上网手册"是当年无数网民的启蒙读物，教人如何上网、如何做个人主页。CSDN 简史记载："完全上网手册"的 Carboy 进入飞华，与高春辉进金山一样，"都是当年比较有名的事件"。站长做得好，直接被知名互联网公司收编——这是第一代站长最常见的"出路"。 [来源：CSDN]</div>
</div>
</div><div class="ce-block" data-id="DTQy4p5G74" >
<div class="ce-block__content" style="">
<h3 class="ce-header ce-header--left">六、时代记忆点：那些只有站长才懂的瞬间</h3>
</div>
</div><div class="ce-block ce-block--focused" data-id="Ak57P4-ZlT" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">如果 1998 年你是一个中国站长，你的日常大概是这样的：</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="xrnpc0iZuw" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">① 拨号上网的"猫"——每次上网都要听调制解调器发出"嘟————嘀嘀嘀嘀————嘟！"的握手声，等上十几秒才"连接成功"，网速 33.6K / 56K；上网时电话打不进来，家里人一接电话就掉线。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="EDkN-KPQj4" >
<div class="ce-block__content">
<div class="cdx-block image-tool image-tool--filled ">
<div class="image-tool__image">
<div class="image-tool__image-preloader" style=""></div>
<img id="aimg_EDkN-KPQj4" class="image-tool__image-picture _zoom" src="https://idceve.com/data/attachment/forum/202610/14/095351pvz5doi82roec5fe.png" title=" 图：56K 模拟调制解调器（真实照片，Wikimedia Commons） " alt=" 图：56K 模拟调制解调器（真实照片，Wikimedia Commons） " data-aid="198"/>
</div>
<div class="cdx-input image-tool__caption" data-placeholder=" 图：56K 模拟调制解调器（真实照片，Wikimedia Commons） "> 图：56K 模拟调制解调器（真实照片，Wikimedia Commons） </div>
</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="Bi2OYmg7Ii" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">② 计数器与访客数——主页底部挂一个免费计数器，每天看"你是第 N 位访客"，数字上千上万就是天大喜事。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="f8uEMm-O1M" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">③ 友情链接——站长之间互相挂链接、换流量，是那个年代最重要的推广方式，"你的站不错，咱们换个友情链接？"是站长圈最流行的社交开场白。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="LRSfogIEWa" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">④ 163 免费邮箱——@163.com 是那个年代最体面的电子名片，申请一个邮箱要排队、要抢；邮箱收信是打开网页的第一件事。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="30vEjpZ2Te" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">⑤ 绿色背景的网页——"欢迎光临我的主页"、跑马灯、"本站正在建设中"、闪烁的 GIF 分割线，是 90 年代末个人主页的标配审美；代码里最常出现的颜色，就是 #00FF00 的绿。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="vgE9jvtkiV" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">这些记忆碎片拼在一起，就是第一代中国站长的青春。他们用最笨的办法（手写 HTML、用 FTP 上传），做出了中文互联网最早的"内容生态"。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="Df7x7DoevR" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">如果中国互联网的历史记录得足够详细，曾经的自己和那拨同时期奋斗的站长们，终究应该在其中留下一笔。</div>
</div>
</div><div class="ce-block ce-block--focused" data-id="scG8f96KC4" >
<div class="ce-block__content">
<div class="ce-paragraph cdx-block ce-paragraph--left">—— 创业邦引用高春辉的话 [来源]</div>
</div>
</div><style type="text/css">
.ce-block {
margin-top: 20px;
margin-bottom: 20px;
}
.ce-block__content,.ce-toolbar__content {
/* max-width:calc(100% - 50px) */
margin-left: auto;
margin-right: auto;
}
/**
* Plugin styles
*/
.ce-header {
position: relative;
padding: 1px 0px 1px 15px;
margin: 0;
line-height: 1.25em;
outline: none;
margin-bottom: 10px;
}
.ce-header p,
.ce-header div {
padding: 0 !important;
margin: 0 !important;
}
.ce-header::before {
content: "";
background-color: #3e8fe3;
width: 6px;
height: 100%;
position: absolute;
left: 0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
/**
* Styles for Plugin icon in Toolbar
*/
.ce-header__icon {
}
.ce-header::before {
position: absolute;
content: attr(data-placeholder);
color: #707684;
font-weight: normal;
display: none;
cursor: text;
}
.ce-header:empty::before {
display: block;
}
.ce-header:empty:focus::before {
display: none;
}
/* FontSize */
h1.ce-header {
font-size: 2.0em;
}
h2.ce-header {
font-size: 1.7em;
}
h3.ce-header {
font-size: 1.4em;
}
h4.ce-header {
font-size: 1.15em;
}
h5.ce-header {
font-size: 0.95em;
}
h6.ce-header {
font-size: 0.8em;
}
/* Alignment*/
.ce-header--right {
text-align: right;
}
.ce-header--center {
text-align: center;
}
.ce-header--left {
text-align: left;
}
.ce-header--justify {
text-align: justify;
}
</style><style type="text/css">
.ce-block {
margin-bottom: 20px;
}
.ce-block__content,.ce-toolbar__content {
/* max-width:calc(100% - 50px) */
margin-left: auto;
margin-right: auto;
}
.ce-paragraph {
line-height: 1.6em;
outline: none;
text-indent: 2em;
font-size: 16px;
}
.ce-paragraph--right {
text-align: right;
}
.ce-paragraph--center {
text-align: center;
}
.ce-paragraph--left {
text-align: left;
}
.ce-paragraph--justify {
text-align: justify;
}
.ce-paragraph-text-indent {
text-align: justify;
}
.ce-paragraph:empty::before{
content: attr(data-placeholder);
color: #707684;
font-weight: normal;
opacity: 0;
}
/** Show placeholder at the first paragraph if Editor is empty */
.codex-editor--empty .ce-block:first-child .ce-paragraph:empty::before {
opacity: 1;
}
.codex-editor--toolbox-opened .ce-block:first-child .ce-paragraph:empty::before,
.codex-editor--empty .ce-block:first-child .ce-paragraph:empty:focus::before {
opacity: 0;
}
.ce-paragraph p:first-of-type{
margin-top: 0;
}
.ce-paragraph p:last-of-type{
margin-bottom: 0;
}
.svg-icon {
width: 1em;
height: 1em;
}
.svg-icon path,
.svg-icon polygon,
.svg-icon rect {
fill: #4691f6;
}
.svg-icon circle {
stroke: #4691f6;
stroke-width: 1;
}
</style><style type="text/css">
.ce-block {
margin-bottom: 20px;
}
.ce-block__content,.ce-toolbar__content {
/* max-width:calc(100% - 50px) */
margin-left: auto;
margin-right: auto;
}
.cdx-list {
margin:0;
outline:none;
display:block;
counter-reset:item;
padding:6px;
}
.cdx-list__item {
line-height:1.45em;
display:block;
padding-top:8px;
margin-left: 2em;
}
.cdx-list__item-children {
display:block;
}
.cdx-list__item {
outline:none
}
.cdx-list__item-content {
word-break:break-word;
white-space:pre-wrap;
grid-area:content;
padding-left:8px
}
.cdx-list__item:before {
counter-increment:item;
white-space:nowrap
}
.cdx-list-li-container {
display: flex;
}
.cdx-list-ordered .cdx-list__item:before {
/* content:counters(item,".",numeric) "." */
}
.cdx-list-ordered {
list-style-type: none;
margin-left: -15px;
counter-reset:item;
font-size: 16px;
}
.cdx-list-unordered {
font-size: 16px;
}
.cdx-list-unordered .cdx-list__item:before {
content:"•"
}
.cdx-list-checklist .cdx-list__item:before {
content:""
}
.cdx-list__settings .cdx-settings-button {
width:50%
}
.cdx-list__checkbox {
padding-top:calc((1.45em - 1.2em) / 2);
grid-area:checkbox;
width:1.2em;
height:1.2em;
display:flex;
cursor:pointer;
font-size: 16px;
}
.cdx-list__checkbox svg {
opacity:0;
height:1.2em;
width:1.2em;
left:-1px;
top:-1px;
position:absolute
}
@media (hover:hover) {
.cdx-list__checkbox:not(.cdx-list__checkbox--no-hover):hover .cdx-list__checkbox-check svg {
opacity:1
}
}.cdx-list__checkbox--checked-1 {
line-height:1.45em
}
@media (hover:hover) {
.cdx-list__checkbox--checked-1:not(.cdx-list__checkbox--checked-1--no-hover):hover .cdx-checklist__checkbox-check {
background:#0059AB;
border-color:#0059AB
}
}.cdx-list__checkbox--checked-1 .cdx-list__checkbox-check {
background:#369FFF;
border-color:#369FFF
}
.cdx-list__checkbox--checked-1 .cdx-list__checkbox-check svg {
opacity:1
}
.cdx-list__checkbox--checked-1 .cdx-list__checkbox-check svg path {
stroke:#fff
}
.cdx-list__checkbox--checked-1 .cdx-list__checkbox-check:before {
opacity:0;
visibility:visible;
transform:scale(2.5)
}
.cdx-list__checkbox-check {
cursor:pointer;
display:inline-block;
position:relative;
margin:0 auto;
width:1.2em;
height:1.2em;
box-sizing:border-box;
border-radius:5px;
border:1px solid #C9C9C9;
background:#fff
}
.cdx-list__checkbox-check:before {
content:"";
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
border-radius:100%;
background-color:#369FFF;
visibility:hidden;
pointer-events:none;
transform:scale(1);
transition:transform .4s ease-out,opacity .4s
}
.cdx-list__checkbox-check--disabled {
pointer-events:none
}
.cdx-list-start-with-field {
background:#F8F8F8;
border:1px solid rgba(226,226,229,.2);
border-radius:6px;
padding:2px;
display:grid;
grid-template-columns:auto auto 1fr;
grid-template-rows:auto
}
.cdx-list-start-with-field--invalid {
background:#FFECED;
border:1px solid #E13F3F
}
.cdx-list-start-with-field--invalid .cdx-list-start-with-field__input {
color:#e13f3f
}
.cdx-list-start-with-field__input {
font-size:16px;
outline:none;
font-weight:500;
font-family:inherit;
border:0;
background:transparent;
margin:0;
padding:0;
line-height:22px;
min-width:calc(100% - 10px)
}
.cdx-list-start-with-field__input::placeholder {
color:#797979;
font-weight:500
}
</style><style type="text/css">
.ce-block {
margin-bottom: 20px;
}
.ce-block__content,.ce-toolbar__content {
/* max-width:calc(100% - 50px) */
margin-left: auto;
margin-right: auto;
}
.image-tool {
--bg-color: #cdd1e0;
--front-color: #388ae5;
--border-color: #e8e8eb;
}
.image-tool__image {
border-radius: 3px;
overflow: hidden;
margin-bottom: 10px;
}
.image-tool__image-picture {
max-width: 100%;
vertical-align: bottom;
display: block;
margin-left: auto;
margin-right: auto;
}
.image-tool__image-preloader {
width: 50px;
height: 50px;
border-radius: 50%;
background-size: cover;
margin: auto;
position: relative;
background-color: #cdd1e0;
background-position: center center;
}
.image-tool__image-preloader::after {
content: "";
position: absolute;
z-index: 3;
width: 60px;
height: 60px;
border-radius: 50%;
border: 2px solid #cdd1e0;
border-top-color: #388ae5;
left: 50%;
top: 50%;
margin-top: -30px;
margin-left: -30px;
animation: image-preloader-spin 2s infinite linear;
box-sizing: border-box;
}
.image-tool__caption::before {
position: absolute !important;
content: attr(data-placeholder);
color: #707684;
font-weight: normal;
display: none;
}
.image-tool__caption:empty::before {
display: block;
}
.image-tool__caption:empty:focus::before {
display: none;
}
.image-tool--empty .image-tool__image {
display: none;
}
.image-tool--empty .image-tool__caption, .image-tool--loading .image-tool__caption {
display: none;
}
.image-tool .cdx-button {
display: flex;
align-items: center;
justify-content: center;
}
.image-tool .cdx-button svg {
height: auto;
margin: 0 6px 0 0;
}
.image-tool--filled .cdx-button {
display: none;
}
.image-tool--filled .image-tool__image-preloader {
display: none;
}
.image-tool--loading .image-tool__image {
min-height: 200px;
display: flex;
border: 1px solid #e8e8eb;
background-color: #fff;
}
.image-tool--loading .image-tool__image-picture {
display: none;
}
.image-tool--loading .cdx-button {
display: none;
}
/**
* Tunes
* ----------------
*/
.image-tool--withBorder .image-tool__image {
border: 1px solid #e8e8eb;
}
.image-tool--withBackground .image-tool__image {
padding: 15px;
background: #cdd1e0;
}
.image-tool--withBackground .image-tool__image-picture {
max-width: 60%;
margin: 0 auto;
}
.image-tool--stretched .image-tool__image-picture {
width: 100%;
}
.image-tool__caption {
text-align: center;
font-size: 14px;
color: #a3a3a3;
}
@keyframes image-preloader-spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
</style><style type="text/css">
.inline-code {
background: rgba(250, 239, 240, 0.78);
color: #b44437;
padding: 3px 4px;
border-radius: 5px;
margin: 0 1px;
font-family: inherit;
font-size: 0.86em;
font-weight: 500;
letter-spacing: 0.3px;
}
</style> 用过IK8、用过黑马个人主页，还有几个个人主页忘记叫什么名字了。网易个人主页空间也用过，那个需要自己写html文件，ftp上传
页:
[1]