Table of Contents | ||||
---|---|---|---|---|
|
...
Code Block |
---|
txtHtml('<div class="card-body"><p class="card-text">~a</p></div>'). txtHtml(Txt, Html) :- txtHtml(Template), applyTemplate(Template, Txt, Html). |
span tag
'<span style="font-family:Roboto;">',
The span
tag is an inline element that is commonly used to style HTML content. We have added a span/3
predicate span(Content, Style, Html)
that just does that and nothing else. An example of a span tag that can be useful is to style the content and change the font family that is used within some HTML content:
Code Block |
---|
<span style="font-family:Roboto;">YOUR HTML CONTENT HERE</span> |
A list of system or web-safe fonts (fonts supported on most devices) can be found here.
Info |
---|
Alternatively, with a bit more work you can also use a wide range of fonts made available by Google. To make that work, you will need to add a link to a Google font in the page header. An example of what that should look like for the Sofia font can be found here. For more on how to add the required HTML code to the header, you should read the section below on how to create a webpage. |
The span tag has other uses too. We have used it, for example, to set the value of a button in the template we used for defining the button/4
predicate.
Check out the html.pl
file for more predefined Prolog predicates for HTML tags that you can use.
...
By means of these and generate with the rule. The HTML code is represented in Bootstrap format, which is also clearly illustrated by examples below or on Bootstrap's documentation website (Bootstrap Documentation).
Note |
---|
Prolog Advice: To manipulate strings and atoms in Prolog it is useful to look at documentation of the following built-in functions: atomic_list_concat, atom_concat, string_concat, append, and maplist here: https://www.swi-prolog.org/. The predicate applyTemplate is a defined predicate that will be explained below. |
...