jsfiddle 使用教程


最近有許多的Css 3 demo,因此為了方便查閱,就將demo部分放在 jsfiddle ,方便日后翻閱。

這是 JSFIDDLE 的官網文檔,都是英文,不過對照看還是可以的:官方文檔

HTML區域:

它的HTML區域已經包含 html / meta 標簽,因此在它的HTML區域就不要再寫文檔類型標簽了,否則會給出警告;

它的使用方式是直接寫你的DOM節構:

<div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="navbar">主菜單
                        <ul class="menu">
                            <li><a href="#" class="fa fa-facebook"></a></li>
                            <li><a href="#" class="fa fa-google-plus"></a></li>
                            <li><a href="#" class="fa fa-twitter"></a></li>
                            <li><a href="#" class="fa fa-linkedin"></a></li>
                            <li><a href="#" class="fa fa-pinterest"></a></li>
                            <li><a href="#" class="fa fa-rss"></a></li>
                            <li><a href="#" class="fa fa-instagram"></a></li>
                            <li><a href="#" class="fa fa-skype"></a></li>
                            <li><a href="#" class="fa fa-github"></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

CSS 區域:

  1. 本地css 直接手寫即可
  2. 加載外部的 css 注意點,jsfiddle 是 htpps 站點,因此,如果需要加載外部的css的話,需要進入 https CDN 搜索你需要的外部css,並復制它的 link鏈接

寫好之后 ,點擊 RUN 運行即可看到效果


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM