- Internet of Things with Arduino Blueprints
- Pradeeka Seneviratne
- 155字
- 2021-07-09 21:38:01
Adding a Cascade Style Sheet to the web user interface
Cascade Style Sheet (CSS) defines how HTML elements are to be displayed. Metro UI CSS (https://metroui.org.ua/) is a cascade style sheet that can be used to apply Windows 8-like style to your HTML elements.
The following Arduino sketch applies Windows 8-like style to the radio button group:
- Open your Arduino IDE and paste the code from the sketch named
B04844_01_05.inofrom the code folder of this chapter. - Between the
<head></head>tags we have first included the JQuery library which consists of a rich set of JavaScript functions:client.println("<script src=\"https://metroui.org.ua/js/jquery-2.1.3.min.js\"></script>"); - Then, we have included
metro.jsandmetro.cssfrom the https://metroui.org.ua website:client.println("<script src=\"https://metroui.org.ua/js/metro.js\"></script>"); client.println("<link rel=\"stylesheet\" href=\"https://metroui.org.ua/css/metro.css\">");
Upload the sketch on your Arduino board and play with the new look and feel. You can modify the other HTML elements and even use the radio buttons by referring to the MetroUI CSS website documentation at https://metroui.org.ua/.
MetroUI CSS style applied to radio buttons
推薦閱讀
- Practical Data Analysis Cookbook
- Building Modern Web Applications Using Angular
- Oracle Database In-Memory（架構與實踐）
- 劍指JVM：虛擬機實踐與性能調優
- Magento 2 Theme Design（Second Edition）
- Instant RubyMotion App Development
- AutoCAD VBA參數化繪圖程序開發與實戰編碼
- OpenShift在企業中的實踐：PaaS DevOps微服務（第2版）
- Learning Network Forensics
- Learning OpenCV 3 Computer Vision with Python（Second Edition）
- Image Processing with ImageJ
- Puppet：Mastering Infrastructure Automation
- MySQL數據庫應用實戰教程（慕課版）
- Android技術內幕（系統卷）
- 基于MATLAB的控制系統仿真及應用