• Like
Haml/Sassを使って履歴書を書くためのn個の方法
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

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

  • 2,555 views
Published

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,555
On SlideShare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
6
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

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