RIOT.JS - Styling
Tag RIOT js dapat memiliki gayanya sendiri dan kita dapat menentukan gaya di dalam tag yang hanya akan memengaruhi konten di dalam tag. Kita juga dapat mengatur kelas gaya menggunakan skrip juga di dalam tag. Berikut ini adalah sintaks bagaimana mencapai gaya tag RIOT.
custom1Tag.tag
<custom1Tag>
<h1>{title}</h1>
<h2 class = "subTitleClass">{subTitle}</h2>
<style>
h1 {
color: red;
}
.subHeader {
color: green;
}
</style>
<script>
this.title = "Welcome to TutorialsPoint.COM";
this.subTitle = "Learning RIOT JS";
this.subTitleClass = "subHeader";
</script>
</custom1Tag>index.htm
<!DOCTYPE html>
<html>
<head>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/riot/3.13.2/riot+compiler.min.js"></script>
</head>
<body>
<h1>Non RIOT Heading</h1>
<custom1Tag></custom1Tag>
<script src = "custom1Tag.tag" type = "riot/tag"></script>
<script>
riot.mount("custom1Tag");
</script>
</body>
</html>Ini akan menghasilkan hasil sebagai berikut -