RIOT.JS - Styling
I tag RIOT js possono avere il proprio stile e possiamo definire stili all'interno dei tag che influenzeranno solo il contenuto all'interno del tag. Possiamo anche impostare una classe di stile utilizzando script e all'interno di un tag. Di seguito è riportata la sintassi su come ottenere lo stile dei 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>Questo produrrà il seguente risultato: