Ways to enhance HTML styling using htm.fromHtml() on Java (Android)

Here is the HTML code for my webpage:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<style type="text/css">
body{
margin: 0;
padding: 0;
width:100%;
height: 100%;


}
h5{
text-align: center;
margin: auto;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: 30px;
font-size: 27px;
background-position: center;
color:  Black;
padding: 75px;
background-size: contain;
}
 </style>
 <body>
    <h5>
    সমাপ্ত
    </h5>
 </body>
</html>

I used the following function in Android to implement this HTML page, but only the text is displayed without any CSS styling:

      Spannable sequence = (Spannable) Html.fromHtml("<!DOCTYPE HTML>\n" +
                                "<html lang=\"en-US\">\n" +
                                "<head>\n" +
                                "\t<meta charset=\"UTF-8\">\n" +
                                "\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n" +
                                "\t<title></title>\n" +
                                "</head>\n" +
                                "<style type=\"text/css\">\n" +
                                "body{\n" +
                                "margin: 0;\n" +
                                "padding: 0;\n" +
                                "width:100%;\n" +
                                "height: 100%;\n" +
                                "}\n" +
                                "h5{\n" +
                                "text-align: center;\n" +
                                "margin: auto;\n" +
                                "position: absolute;\n" +
                                "top: 0;\n" +
                                "left: 0;\n" +
                                "bottom: 0;\n" +
                                "right: 0;\n" +
                                "height: 30px;\n" +
                                "font-size: 27px;\n" +
                                "background-position: center;\n" +
                                "color:  Black;\n" +
                                "padding: 75px;\n" +
                                "background-size: contain;\n" +
                                "}\n" +
                                "</style>\n" +
                                "<body>\n" +
                                "\t<h5>\n" +
                                "\t\tসমাপ্ত\n" +
                                "\t</h5>\n" +
                                "</body>\n" +
                                "</html>");

The HTML text is shown, but the CSS is not applied. Any suggestions on how to fix this issue would be greatly appreciated.

Answer №1

Not all HTML tags and attributes are supported. For a comprehensive list of the supported tags in Html.fromHTML, please check out this blog post.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Numerous passcodes needed for easy access to secured webpage

I am currently working on a basic webpage that uses a PHP password script to grant users access. It's functioning perfectly for one user, but now I need to add a second password for another user. If anyone has any suggestions or solutions to this issu ...

Tips for transforming a hover menu into a clickable menu

The scenario above demonstrates that when hovering over the dropdown menu, it displays a submenu. However, I want the submenu to be displayed after clicking on the dropdown text. Could anyone provide assistance on how to change the hovermenu to a clickabl ...

Adjusting canvas size to match content dimensions

I posed a similar inquiry and it was categorized as a duplicate even though the suggested duplicate did not provide an answer to my question. Edit: The purported duplicate was [stackoverflow.com/questions/17211920/make-canvas-height-auto][1] I am utilizi ...

Mastering the art of sorting HTML tables with various columns using JavaScript and jQuery

When they click the button, it should alphabetize the rows in the table according to the clicked column. Is there a way to achieve this sorting functionality without using a javascript/jquery plugin or library? I prefer to develop my own code for this pa ...

Generate a line chart adorned with dots and customized labels utilizing a pair of distinct data sets

Is there a way to enhance my line graph with labeled dots using two separate data sets, one of which is from an API? For reference, I would like the graph to resemble the sample image linked here: https://i.sstatic.net/yUcWw.jpg Here are the details of th ...

Use jQuery to replace this color with that color in CSS every time it appears

I have numerous div elements, some with a background-color: #aaa, others with font color: #aaa, and some with border-color: #aaa. There are also divs with various other colors. I am looking to update these colors (#aaa) to #ccc throughout the CSS. While ...

Unsure of the datatype for a particular field in a JSON object? No problem - here's how to

Working with a JSON response, I am using Jackson to parse it. However, the type of one field is unknown. For example: {"name" : "Catalina"} OR {"name" : {"First" : "Catalina", "Last" : "Kyle"}} How can I deserialize this object into a POJO? class Nam ...

Dealing with JSON data in the format of `(Object object)` requires a specific approach

I originally encountered object object when attempting to display JSON API data in HTML. I then used keyvalue in *ngFor which allowed me to display the object, but I am wondering how I can access and display the entire JSON data? Here are the relevant cod ...

Issue with jQuery functionality when page is loaded through AJAX request

My index page currently has jQuery and a js file for a slider plugin loaded. I am using an on click event to load an external page using .load. Here is the code snippet: //jQuery loaded from Google CDN here (in head) jQuery( document ).ready(function() { ...

Transform a dynamic Maya model into JSON format for seamless integration with Three.js

After creating a Maya model in Maya 2008, I need to convert it to a JSON format for use with three.js. I have experimented with different methods including: 1) Utilizing the threeJsFileTranslator.py Maya plugin provided in the threejs package. 2) Trying ...

The iframe came to a halt as soon as it was no

I am currently developing a live video website that utilizes third-party tools to play the videos. To simplify things, I have embedded all the components required for live video into a single HTML page. Here is how it looks: <iframe data-v-140cfad2= ...

Switch the checkbox attribute for multiple items within a carousel using Angular 2/Typescript

I am currently working on a carousel feature where each item has a checkbox above it. My goal is to be able to click on an item and have its corresponding checkbox checked. The current code successfully achieves this, but the issue I'm facing is that ...

The tooltip for the Google+ button stopped working

After setting up my Portfolio, I added a Google+ button. However, the page lacks styling and there seems to be an issue with the tooltip causing delays. Can anyone help me identify where the problem lies? ...

The alignment of my Navbar Brand is off in my Navigation Bar and won't align to

<body> <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> <div class="container-fluid"> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs ...

Use CSS to align one item to the left and center the rest on the page

Is there a way in CSS to achieve the following layout: a single block element anchored to the left side of the page the other elements centered on the page (not centered in relation to the remaining space) If there isn't enough space for this layout, ...

Troubles encountered when loading an Angular JS website using an Android Webview

Greetings everyone! I've been attempting to load GTV onto an Android WebView. It's working perfectly on the mobile browser, but for some reason, it's not loading in the webview. Here is my code snippet: WebView theWebPage = new WebView(t ...

When using editText.getText().toString, it may result in returning an empty

As a newcomer to Android, I was able to piece together this code with the assistance of this platform: Java: public class MyActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInst ...

Difficulty encountered in positioning a div element

I have been attempting to align the div with class bioDiv under the image, but despite various attempts, I find myself feeling more and more confused. Can someone please review the code for me and offer a clue? I want to retain the same appearance, just re ...

Display the navigation controls in the CSS Bootstrap Carousel only when hovering over the control section, rather than when hovering over the entire carousel

My carousel displays full page images, but I want the controllers to only appear when the mouse hovers over the specific area they are in, rather than appearing when the mouse is anywhere on the page. .carousel .carousel-control { visibility: hidden; ...

What is the best way to set up a task at specific intervals of time in a Java thread without utilizing Timer or any supplementary threads?

I am looking to execute a command every 3 seconds in an Android application. The app currently utilizes a thread, and within that thread, I need to call a specific method every 3 seconds. For example, when the thread starts: 1 2 3 runCommand() 4 5 6 runCom ...