RIOT.JS - Tạo kiểu
Các thẻ RIOT js có thể có kiểu riêng và chúng ta có thể xác định kiểu bên trong các thẻ mà sẽ chỉ ảnh hưởng đến nội dung bên trong thẻ. Chúng tôi cũng có thể đặt một lớp kiểu bằng cách sử dụng các tập lệnh cũng như trong một thẻ. Sau đây là cú pháp để đạt được kiểu dáng của thẻ 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>Điều này sẽ tạo ra kết quả sau: