新增返回頂部的功能

1、新增可點選圖片，點選即可返回到頂部

<div>
    <a href="#">
        <img src="../static/img/gotop.png" alt="返回頂部" id="gotop" title="返回頂部" style="z-index:25; position: fixed;
         right: 10px; bottom: 10px;display: none;">
    </a>
</div>

2.設定監聽指令碼

<script>
    $(function () {
        $(function(){
            $(window).scroll(function(){
                if($(window).scrollTop() > 100){
                    $("#gotop").fadeIn(1000);//一秒漸入動畫
                }else{
                    $("#gotop").fadeOut(1000);//一秒漸隱動畫
                }
            });

            $("#gotop").click(function(){
                $('body,html').animate({scrollTop:0},400);
            });
        });
    });
</script>
 

檢視其他網頁設計原理

直接網頁另存為.html檔案，其資原始檔如.css.js.jpg等會自動儲存到磁碟中，可以直接引用

常用協議和埠：

ftp（File Transfer Protocol） 協議預設埠：21 tcp
ssh（Secure Shell） 協議預設埠：22 tcp
http 協議預設埠：80 tcp
https 協議預設埠：443 tcp/udp ##

多重樣式優先順序

內聯樣式）Inline style > （內部樣式）Internal style sheet >（外部樣式）External style sheet > 瀏覽器預設樣式
注意：如果外部樣式放在內部樣式的後面，則外部樣式將覆蓋內部樣式。

元素的寬度和高度

當指定一個CSS元素的寬度和高度屬性時，你只是設定內容區域的寬度和高度。要知道，完全大小的元素，你還必須新增填充，邊框和邊距。.
下面的例子中的元素的總寬度為300px：
例項

div {
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;
}

嘗試一下 »
讓我們自己算算最後元素佔據總寬度：
300px (寬)

• 50px (左 + 右填充)
• 50px (左 + 右邊框)
• 50px (左 + 右邊距)
  = 450px