Haml/Sassを使って履歴書を書くためのn個の方法

3,286 views

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,286
On SlideShare
0
From Embeds
0
Number of Embeds
593
Actions
Shares
0
Downloads
8
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • Haml/Sassを使って履歴書を書くためのn個の方法

    1. 1. Haml/Sass
    2. 2. <body> HTML+CSS </body>
    3. 3.
    4. 4.
    5. 5. %h2 %span
    6. 6. %h2 -- %span
    7. 7. <h2> <span> </span> </h2>
    8. 8. !!! XML !!! %html %head %title %body %h1 %h2 %span :
    9. 9. !!! XML !!! %html %head %title %body %h1 %h2 %span :
    10. 10. !!! XML <?xml version='1.0' encoding='u !!! <!DOCTYPE html PUBLIC "-//W
    11. 11. markup haiku !!! XML <?xml version='1.0' encoding='u !!! <!DOCTYPE html PUBLIC "-//W
    12. 12. markup haiku markup golf !!! XML <?xml version='1.0' encoding='u !!! <!DOCTYPE html PUBLIC "-//W
    13. 13. h2 span :color midnightblue
    14. 14. h2 span :color midnightblue h2 span { color: midnightblue; }
    15. 15. %head %style{ :type => ‘text/css’ } :sass h2 :font :weight normal :size medium span :font-weight bold :color midnightblue
    16. 16. %head %style{ :type => ‘text/css’ } :sass h2 :font :weight normal :size medium span :font-weight bold :color midnightblue
    17. 17. %head %style{ :type => ‘text/css’ } :sass h2 :font :weight normal :size medium span :font-weight bold :color midnightblue
    18. 18. ifchanged
    19. 19. ifchanged
    20. 20. %body #header %h1 %h2 %span : #main %h2 .section
    21. 21. %body #header %h1 %h2 %span : #main %h2 .section
    22. 22. <body> <div id=”header”> ... </div> <div id=”main”> <h2> </h2> <div class=”section”> </div> </div> </body>
    23. 23. <body> <div id=”header”> ... </div> <div id=”main”> <h2> </h2> <div class=”section”> </div> </div> </body>
    24. 24. #main %h2 .section %table %tr %td %td %td
    25. 25. #header ... #main h2 :border-left 10px solid midnightblue :padding-left 15px .section :margin-left 10px table tr td :padding 0 5px
    26. 26. #header ... #main h2 :border-left 10px solid midnightblue :padding-left 15px .section :margin-left 10px table tr td :padding 0 5px

    ×