请问一个CSS问题。
发布网友
发布时间：2022-04-24 20:10
共4个回答
热心网友
时间：2022-04-24 21:40
<div class="list">
<a href="javascript:;"><i></i>排行</a>
</div>
<div class="media">
<a href="http://media.so.com/?src=hometop" target="_blank"><i></i>传媒</a>
</div>
<div class="srch">
<dl>
<dt>
<a href="javascript:;"><i></i>搜索</a>
</dt>
<dd>
<a class="close" href="javascript:;"></a>
<form target="_blank" action="http://news.so.com/ns" method="get">
<fieldset>
<input name="src" class="src" type="hidden" value="hometop">
<input type="text" name="q" value="" maxlength="100" autocomplete="off"><button type="submit">搜索</button>
</fieldset>
</form>
</dd>
</dl>
</div>
<div class="fast">
<dl class="active">
<dt>
<a href="javascript:;"><i></i>快讯</a>
</dt>
<dd>
<a class="close" href="javascript:;"></a>
<p id="mole_%E6%96%B0%E9%97%BB%E5%BC%B9%E7%AA%97"></p>
</dd>
</dl>
</div>
<div class="totop">
<a href="#top"><i></i></a>
</div>
</div>
上面是原网页里的代码
分析就知道其实就是几个div，然后写几个样式就行了
热心网友
时间：2022-04-24 22:58
#atom-totop div{height:54px;margin-top:3px;position:relative;width:54px; line-height:54px;}
#atom-totop a{background:#a2cfa2;color:#fff;display:inline-block;font-size:14px;height:54px;text-align:center;text-decoration:none;width:54px}
#atom-totop a:hover{background-color:#5cad5c}
</style>
<div id="atom-totop">
<div class="top"><a href="#">TOP</a></div>
</div>
做了个top的效果你看下追问请问他是如何判断，向下拉一些才会出现TOP这个按钮，在最上面不会出现这个按钮的。谢谢
追答#atom-totop{bottom:20px;margin-right:-564px;position:fixed;_position:absolute;right:50%;_top:expression(eval(document.documentElement.scrollTop || document.body.scrollTop)+eval(document.documentElement.clientHeight || document.body.clientHeight)-305+'px');z-index:9}
这一行里 bottom:20px 就是居下20个像素 right:50% 其实是居中 但是margin-right:-564px; 但是偏右侧了...
热心网友
时间：2022-04-25 00:32
热心网友
时间：2022-04-25 02:24
