I'm in the process of converting our existing ASP.NET web form pages to support HTML5.
According to several sources, all I need to do is change my aspx page so that it has the following layout:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>/title>
</head>
<body>
</body>
</html>
Here is the top part of the ASPX page:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="MyForm.aspx.cs" EnableEventValidation="false"
Inherits="MyForm" ValidateRequest="false" %>
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title></title>
</head>
<body>
<div> BLA BLA BLA </div>
</body>
</html>
My problem is, when the page is rendered in a browser, and I view the source of the page, I still see the old DOCTYPE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML>
<html lang="en">
<head>
.....
Any idea how I can get rid of this?
Related
Although this page seems to load file, I get an error from NU HTML checker. Not sure how to clear the error, because it seems everything in the body would of course be a child of the XHTML body element.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>How About Them Apples?</title>
<meta charset="utf-8" />
<link href="apples.css" rel="stylesheet" type="text/css" />
</head>
<body>
<apples xmlns:apls="https://www.dole.com/en/products/apples">
<apls:apple>
<apls:name>Red Delicious</apls:name>
<apls:color>Red</apls:color>
</apls:apple>
<apls:apple>
<apls:name>Golden Delicious</apls:name>
<apls:color>Yellow</apls:color>
</apls:apple>
</apples>
</body>
</html>
My structure
WEB-INF
└── thymeleaf
├── fragments
│ └── head.html
├── index
│ └── index.html
└── layout.html
layout.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:insert="~{fragments/head :: head}" th:remove="tag"></head>
<body>
<!--${view} == "index/index"-->
<div th:insert="~{${view} :: content}" th:remove="tag"></div>
</body>
</html>
index.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title id="pageTitle">My Title with ID</title>
</head>
<body>
<div th:fragment="title">My Title With fragment</div>
<div th:fragment="content">
My page
</div>
</body>
</html>
head.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head" th:remove="tag">
<meta charset="utf-8">
<title>??????</title>
<link href="/css/bootstrap.css" rel="stylesheet">
</head>
<body>
</body>
</html>
I'm new to Spring and Thymeleaf. I'm trying to build a simple CRUD, but I'm stuck in the following situation:
What I want is: in index.html set a title variable and in head.html fragment retrieve this title variable and print it.
What can I do?
I think you are looking for 8.3 Flexible layouts The documentation is awesome and easy to follow, but here is also simple case for just inserting title string
layouts/layout.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" th:fragment="page(title)">
<head th:replace="fragments/head :: common_header(title=${title})"></head>
<body>
<div th:replace="this :: content"></div>
</body>
</html>
fragments/head.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="common_header(title)">
<title th:text="${title}">The awesome application</title>
</head>
<body></body>
</html>
index.html (indexTitle comes from controller or you can just put string there)
<html xmlns:th="http://www.thymeleaf.org"
th:include="layouts/layout :: page(title=${indexTitle})">
<head></head>
<body>
<section th:fragment="content">
<div class="block">Part of index.html</div>
</section>
</body>
</html>
And here is also simplified github demo from one of my project you can play with
You should use th:include.
index.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="header :: title">
</head>
<body>
<div>My Title With fragment</div>
<div>
My page
</div>
</body>
</html>
head.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="title" >
<title>??????</title>
</head>
<body>
</body>
</html>
I have written a website using HTML and CSS and, basically, I'm trying to get it to display now. The code is just a page of text and a few images. Currently when I go to the domain, the source code from start to finish is displayed instead of the actual content.
I just got cPanel hosting with godaddy (who naturally weren't of any help). I downloaded cyberduck. Uploaded the file containing the HTML text and called it index.html.
A CSS file was uploaded, and saved as index.css This might be the issue if something was incorrect.
On cyberduck it says there is a file called layout-style.css, perhaps I should edit that and add my CSS code to it?
Possibly the top few lines of the HTML code are missing some important command? [updated]:
<!DOCTYPE html>
<html lang="en">
<body>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<div class = enterprise> <br>
<p>text<p>
</div>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
Also, does Bootstrap have to be installed anywhere?
I appreciate your responses.
The content must be in the body tag
The structure of an HTML document is:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Article</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<!-- CONTENT HERE -->
<div >
<h1>Site name</h1>
</div>
</body>
</html>
You should not have in the part.
This is a html5 structure :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
Then you should put inside the part like this :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div class= top>
</div>
<div class = enterprise>
<p> text goes here </p>
</div>
</body>
</html>
I can't set the font-size of a text input from the style sheet. However, it works fine by setting the style attribute.
This works:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text-htmlcharset=utf-; 8" />
<title>Test</title>
<style type="text/css">
#about {
}
</style>
</head>
<body>
<input id="about" type="input" value="anything" style="font-size:21pt;" />
</body>
</html>
This does not work (font-size is ignored):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text-htmlcharset=utf-; 8" />
<title>Test</title>
<style type="text/css">
#about {
font-size:21pt;
}
</style>
</head>
<body>
<input id="about" type="input" value="anything" />
</body>
</html>
What am I missing? Surely, you're not expected to use inline style for all text inputs? That seems pretty tacky and redundant in some cases. Thanks a bunch!
Change <style type="text/javascript"> to <style type="text/css">
You are confusing the browser because it is looking for JavaScript code, but you are feeding it CSS. <script> tags should be used for javascript, and <style> tags for CSS.
Your style block has a type of text/javascript. Remove that and it'll work fine.
It's legal to nest SVG documents inside XHTML documents; but is it legal to nest XHTML documents inside other XHTML documents in the same fashion?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sup</title>
</head>
<body>
<h1>Hello World!</h1>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Nested document</title>
</head>
<body>
<p>This is a sample</p>
</body>
</html>
</body>
</html>
No, the html element is only allowed as root element of the document.
You can, using <iframe> (though not recommended and should be avoided).