TECH I.S. テックアイエスガイド エディター
mystyle.scss
mystyle.css
mypage.html
/* Define mixin with two arguments */ @mixin bordered($color, $width) { border: $width solid $color; } .myArticle { @include bordered(blue, 1px); // Call mixin with two values } .myNotes { @include bordered(red, 2px); // Call mixin with two values }
.myArticle { border: 1px solid blue; } .myNotes { border: 2px solid red; }
<!DOCTYPE html> <html> <link rel="stylesheet" href="mystyle.css"> <body> <h1>Hello World</h1> <p class="myArticle">This is some text in my article.</p> <p class="myNotes">This is some text in my notes.</p> </body> </html>
Try It | Online Web Tutorials