I'm creating an html file based on xml and xsl with XslCompiledTransform in c#.net. This works perfectly.
But the xsl also has a css file included, and I'm wondering if there is any way to get this css styles included in the output html file, so it can be showed as a standalone file (so I don't have to copy the css file to wherever i want to see the file).
To define the style of each tag explicitly is not an option either unfortunately, and the file is of course really ugly without the css.
Any help would be very much appreciated! :)
In your output html add a style sheet link within the <head> tag.
<link rel="stylesheet" type="text/css" href="mystyle.aspx" />
Then add a page to your project called mystyle.aspx. In Page_Load of this file you do your xslt transformation to output only the css part. (And remove the css part of the transformation for the html pages).
protected void Page_Load(object sender, EventArgs e) {
Response.Clear();
Response.ContentType = "text/css";
string css = // Do your xslt transformation here
Response.Write( css );
Response.End();
}
If the CSS is the same for all pages, you might want to add some caching to the code above to save doing the transformation every time.
You might have to use some parameters to point to your xml/xslt, but you haven't provided any information in your question in this regard.
Related
I tried to save rendered C# web browser to my hdd. But it only save html source only, no css or jquery js file. I tried with 3 methods.
It only creates only html file without any css, and jquery js files.
File.WriteAllText(myDocumentPath, webBrowser5.Document.Body.Parent.OuterHtml, Encoding.GetEncoding(webBrowser5.Document.Encoding));
2.It only creates content text. No html, css, js
File.WriteAllText(#"text.txt", webBrowser5.Document.Body.InnerText);
3.It creates bigger html file, still no css or jquery js files
writer.Write(webBrowser5.DocumentText);
private void button1_Click(object sender, EventArgs e)
{
String source = ("viewsource.html");
StreamWriter writer = File.CreateText(source);
String myDocumentPath = System.IO.Path.GetDirectoryName(Application.ExecutablePath) + "\\111.html";
//It only creates only html file without any css, and jquery js files.
File.WriteAllText(myDocumentPath, webBrowser5.Document.Body.Parent.OuterHtml, Encoding.GetEncoding(webBrowser5.Document.Encoding));
//it only creates content text
File.WriteAllText(#"text.txt", webBrowser5.Document.Body.InnerText);
//It creates bigger html file, still no css or jquery js files
writer.Write(webBrowser5.DocumentText);
writer.Close();
}
I found solution on codeproject. MHTML is the way to go.
http://www.codeproject.com/Articles/12977/Harvesting-Web-Content-into-MHTML-Archive
Other solution is save as image:
http://www.codeproject.com/Articles/6601/Capture-an-HTML-document-as-an-image
I have small question that I can't quite figure out solution myself or find any answer (or clue) on web. Let me explain my problem.
I uploaded files to my SQL server using ASP.NET application.
The thing is, I'd like to view content of those files on aspx page.
Files are only code files (.cs, .aspx etc), basicaly txt in different technologies. I'd also like to use highlight.js to view those files as code.
Try something like this:
UI:
Import required hightlight required js/css files in .aspx page.
<link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
Have one label/textarea to show code of .aspx/.aspx.cs file under
<pre><code class="cs"><asp:Label id="lblCode" runat="server"/></code><pre>
Server side:
In Page_Load() make db call to get content of .aspx/.aspx.cs files from database and set to label.
protected void Page_Load()
{
this.lblCode=DataAccessLayer.GetCode();
}
Check below links for more details about highlight.js
https://highlightjs.org/usage/
http://highlightjs.readthedocs.org/en/latest/css-classes-reference.html
I'm converting a desktop application that hosts HTML content into an online application. I have various large pieces of prebuilt static html that need to be included in an MVC page depending on user actions. Each of the static html pages includes at least one img tag that references a file that, in a Web Forms page would be located in the same directory. Here's a very simplified example:
Static html:
<html>
<!-- Large chunk of html -->
<img src="logo.gif" >
<!-- More html -->
</html>
SampleController:
Dim html as String = GetFileContentAsString("~/Content/Sample/Static.html")
ViewBag.StaticHTML = PrepareHTMLContent(html)
View:
#Html.Raw(ViewBag.StaticHTML)
The result of the above is a page (e.g. http://localhost:12345/Sample) with a broken image link in the middle of the HTML. I'm already preprocessing the html where possible to strip out useless tags and insert Javascript and CSS links but preprocessing the image paths is unreliable because they could be anywhere in the static html and are quite likely to be inconsistent or otherwise quirky.
So how can I place (or create) the image file in the right location for the static html to pick it up? Is there any other option (bearing in mind that I also need to link CSS and JavaScript files and that the static html has a bunch of other files associated with it that need to be kept in a single location)?
Or is there a way to define or override the location the dynamic MVC page is built?
Easiest thing would be to have /Sample return an HTML page that simply loads /~Content/Sample/Static.html into an iframe so that the browser will resolve relative paths in static.html to be within /~Content/Sample/
I have searched and searched for an answer to this across the web, yet I have not found a "clearly stated" answer as to why this is happening. And I have re-worked to no avail.
I have a Asp.Net site, with a "Master Page" and few "Content" pages
There is a CSS file which successfully assigns a "background-image" in the body - for all the pages:
body { background-image: url('../Images/TestImage1.jpg'); }
I have another image, say TestImage2.jpg, which sits in same Images folder in the solution, and I want to display this image on a specific "Content Page" when that page loads. Yet, it is not loading on the page, and background just turns white without any image at all - here's my code:
My MasterPage has the correct items for runat="server":
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
... and also...
<body runat="server">
<form style="height: 906px" runat="server">
Now, here's my code-behind for the content page I wish to have new image appear on Page_Load:
using System;
using System.Text;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class TechCall : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder script = new StringBuilder();
script.Append("<script type=\"text/javascript\">");
script.Append("document.body.style.background = \"url('../Images/CPUBack2nd.jpg')\";");
script.Append("document.body.style.backgroundRepeat = 'no-repeat';");
script.Append("</script>");
this.ClientScript.RegisterClientScriptBlock(this.GetType(), "changeBackground", script.ToString());
}
}
CPUBack2nd.jpg is the actual of name of the image in place of TestImage2.jpg, but as far as I can see, I am using the correct path for the image, as like the one in the CSS file which defines the default background image. Yet, when the page loads, no image at all appears for the background - just a white space, and original image appears on other pages correctly.
Can someone examine and tell me what I am missing here? Note: please don't suggest JQuery, as if it can be solved using Javascript, then I wish to stick with this usage, as I just want to learn to make it work with JS.
I'd suggest not using javascript at all. You should have a handy ContentPlaceHolder in the header section. Add the following in there to overide the default body style
<style type="text/style">
body { background-image: url('../Images/TestImage2.jpg'); }
</style>
As this will appear in the page after the head contents of the materpage it will overide the earlier CSS.
I would also consider using Root Releative paths particularly on master pages as it makes the releative location of the calling document and the called resource irrelevant. In which case change the above to:
<style type="text/style">
body { background-image: url('/Images/TestImage2.jpg'); }
</style>
Assuming that the Images directory resides at the root level of your document.
If you really want to persist with javascript. Check the path or use Root Relative. Remember that the path is relevant to the document calling the resorce. So just because a path works in a CSS file does not mean it will work in a page which sits at a diferent level of the website. Use a CSS debug tool Like FireBug for Firefox (a free download) or Developer Tools in Chrome (in built) to check if the image was at the expected location.
After much wrangling, moving some things around and isolating them in the CSS style sheet to clean up the Master page, where I had some stray CSS classes, AND of course building on the "hunch" provided by Jon P on possible root relative with Javascript, here's what did it:
Instead of using this:
script.Append("document.body.style.background = \"url('../Images/TestImage1.jpg')\";");
The answer was to use this:
script.Append("document.body.style.background = \"url('/MyProjectName/Images/TestImage2.jpg')\";");
So, I don't know why I had go all the around the world it seems to figure that out, but I guess that's how it is with programming... the difference ALWAYS lies in the LITTLE THINGS!
Thanks to all who contributed to getting me to think about what was going on here! Hence, the lesson is also THIS CAN BE DONE WITH JAVASCRIPT. :)
I'm using a WebBrowser control and the text displays but it isn't using the linked css, it just appears as plain text.
I'm populating it like so
webBrowser1.DocumentText = some_text;
In some_text is <link rel="stylesheet"href="PF.css"> along with the rest of the html
When I save some_text to a file and have the WebBrowser navigate to it it works fine
webBrowser1.Navigate(#"C:\test.html"); and PF.css is in C:\
I've put PF.css in my project folder, where all the class files are.
How can I make the WebBrowser control use/display my linked css file?
I don't want to save off my string to a file and then navigate to it.
thanks
mshtml.HTMLDocument CurrentDocument = (mshtml.HTMLDocument)webBrowser1.Document.DomDocument;
mshtml.IHTMLStyleSheet styleSheet = CurrentDocument.createStyleSheet("", 0);
StreamReader streamReader = new StreamReader(#"C:\PF.css");
string text = streamReader.ReadToEnd();
streamReader.Close();
styleSheet.cssText = text;
kind of a krapy way to do it, but everything I read seems to point to the webbrowser control can't do css unless you Navigate to a file/url and it's included in there.
BTW you have to add a ref to Microsoft.mshtml.
Maybe future versions of this control could handle linked stylesheets...
You can use inline style as..
<html>
<head>
<style>
// all my style here
</style>
</head>
<body>
..
..
</body>
</html>
If by put it in your project folder, do you mean your bin folder, or the folder with the .sln file in it? If it's the latter, you have to put it in the same folder as your executable (e.g. bin/Debug/PF.css, bin/Release/PF.css, etc).
Alternatively, you can embed it in the HTML using a <style type="text/css"><!-- CSS Here --></style>, and replace the comment with your CSS. If you don't want to hardcode it in where ever you get some_text from, you can dynamically replace it by loading PF.css:
using (StreamReader sr = new StreamReader("PF.css"))
{
some_text = String.Format(some_text, sr.ReadToEnd());
}
That example assumes some_text contains the following:
<style type="text/css">
{0}
</style>