缘起

爱博体育投注,住户都说康奈尔笔记法,很好用吧,能对抗遗忘曲线,让您的笔记一石两鸟,有趣味的同窗自行百度哈。

网上有许多现成的沙盘,下载下来之后吧,瞧着类似在地方写英文或然更有益于一点,行距不大,而且还有网址在上头,心里不是很乐于的说啊。后来想着自身在word大概excel里面做1个模板出来,后来愣是不会把叁个报表的一条龙设置成占总表格的百分之七十,最后遗弃,后来想起来,css里面是足以用cm做单位的哟,为啥不友善写一个呢,只用div就足以了啊

缘起

人家都说康奈尔笔记法,很好用吗,能抵抗遗忘曲线,让您的笔记一语双关,有趣味的同校自行百度哈。

网上有许多现成的模版,下载下来之后吧,望着类似在上头写英文大概更方便一点,行距相当小,而且还有网址在上边,心里不是很愿意的说呢。后来想着自个儿在word或然excel里面做1个模板出来,后来愣是不会把多少个报表的一条龙设置成占总表格的七成,最终放任,后来想起来,css里面是足以用cm做单位的呀,为何不谐和写叁个啊,只用div就足以了哟

实现

  1. 先把叁个div设置成帕萨特纸的分寸,宽21cm,高29.7cm

        <div id="abody">
        </div>
    

    #abody { width: 21cm; height: 29.7cm; margin: 0 auto; overflow: hidden; padding: 1.5cm 1.2cm 1.2cm 2.5cm;}
    
  2. 给君威纸这么大的div里面加多少个转变的div,贰个往左,占用29%的长空,3个往右,占用68%的半空中

    <div id="main" class="main le">
            <div class="aline">提示</div>
            <div class="aline"></div>
    </div>
    <div id="sider" class="main ri">
            <div class="aline">笔记</div>
            <div class="aline"></div>
    
    </div>
    <div id="footer" class="footer">
    
            <div class="aline doubleline">概要</div>
            <div class="aline"></div>
    </div>
    

    用css的border分开两栏爱博体育投注 1

    .main {height: 75%; overflow: hidden;}
    
        .le { width: 28.99999%; border-right: double 3px #666; float: left; }
        .ri { width: 69.99999%; float: right; }
    
  3. 往大框里面写一行一行的横线,用一个div 的aline类已毕,html见下面

    此地若是你的编辑器援助emmet的话,写贰个div.aline*42,就会有42行相同的div出现了。然后用css的border属性画出一条条的线出来。

    .aline { height: 0.9cm; border-bottom: 1px; border-bottom-style: dashed; border-bottom-color: #999; 
                margin-right: 8px; color: #eee; line-height: 0.9cm;}
    
  4. 再在左右七个大框的前边放贰个div,清除浮动,放概要有的。

    <div id="main" class="main le">
            <div class="aline">提示</div>
            <div class="aline"></div>
    </div>
    <div id="sider" class="main ri">
            <div class="aline">笔记</div>
            <div class="aline"></div>
    
    </div>
    <div id="footer" class="footer">
    
            <div class="aline doubleline">概要</div>
            <div class="aline"></div>
    </div>
    

    ,里面的首行,用实线分出来5Enclave笔记的下一些结构来

    .footer {clear: both; overflow: hidden;}
    .doubleline { border-top: double 3px #666;}
    
  5. 似乎此,很简单的哈

    再见2017,你好,2018。
    想拿着直接打印着用的话,在那边https://files.cnblogs.com/files/nimeiz/0011.pdf

实现

  1. 先把三个div设置成CIMA纸的轻重,宽21cm,高29.7cm

        <div id="abody">
        </div>
    


    #abody { width: 21cm; height: 29.7cm; margin: 0 auto; overflow: hidden; padding: 1.5cm 1.2cm 1.2cm 2.5cm;}

  2. 给Phaeton纸这么大的div里面加四个转变的div,二个往左,占用29%的半空中,1个往右,占用68%的半空中

    <div id="main" class="main le">
            <div class="aline">提示</div>
            <div class="aline"></div>
    </div>
    <div id="sider" class="main ri">
            <div class="aline">笔记</div>
            <div class="aline"></div>
    
    </div>
    <div id="footer" class="footer">
    
            <div class="aline doubleline">概要</div>
            <div class="aline"></div>
    </div>
    

    用css的border分开两栏爱博体育投注 2

    .main {height: 75%; overflow: hidden;}
    
        .le { width: 28.99999%; border-right: double 3px #666; float: left; }
        .ri { width: 69.99999%; float: right; }
    
  3. 往大框里面写一行一行的横线,用四个div 的aline类已毕,html见上边

    此地假诺你的编辑器帮衬emmet的话,写四个div.aline*42,就会有42行相同的div出现了。然后用css的border属性画出一条条的线出来。

    .aline { height: 0.9cm; border-bottom: 1px; border-bottom-style: dashed; border-bottom-color: #999; 
                margin-right: 8px; color: #eee; line-height: 0.9cm;}
    
  4. 再在左右七个大框的前面放三个div,清除浮动,放概要有的。

    <div id="main" class="main le">
            <div class="aline">提示</div>
            <div class="aline"></div>
    </div>
    <div id="sider" class="main ri">
            <div class="aline">笔记</div>
            <div class="aline"></div>
    
    </div>
    <div id="footer" class="footer">
    
            <div class="aline doubleline">概要</div>
            <div class="aline"></div>
    </div>
    

    ,里面的首行,用实线分出去5冠道笔记的下局地结构来

    .footer {clear: both; overflow: hidden;}
    .doubleline { border-top: double 3px #666;}
    
  5. 就这么,很简短的哈

    再见2017,你好,2018。
    想拿着一贯打印着用的话,在那里https://files.cnblogs.com/files/nimeiz/0011.pdf