I am using CEFSharp with a LocalSchemeHandler.
I have the following directory structure in a css directory.
semantic-2.1.8.min.css
icon.min.css
themes
-- default
-- assets
-- fonts
icons.eot
icons.otf
icons.svg
icons.ttf
icons.woff
My html page looks like this
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<link href="../css/semantic-2.1.8.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="../js/jquery-2.2.0.min.js"></script>
<script type="text/javascript" src="../js/semantic-2.1.8.min.js"></script>
...
I make a request of semantic like this
iconElm.addClass("star half empty red");
an empty red box will be displayed.
By VS debugging I have determined that the semantic css file is requested, and semantic loads in the page. The icon files aren't requested, and don't display.
Related
have a problem with Live Server Updating Index.html ...
It's works when i doing manually save... working with big project, and manually update every time page is too stupid deal
in Index.html I using Iframe to navigation.html ..
pay attention when i updating navigation.html it's working , updating ...
but when i trying to update index.html .. unfortunately ...
Here Is :::
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Pam dasd adsadsa dasdsa </h1>
<iframe 1 src ="navigation.html" linkTarget = "iframe2">
<iframe2>
</body>
</html>
navigation.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<ul>
<li>agent 1 link</li>
<li>agent 2 link</li>
<li>agent 3 link</li>
<li>agent 4 link</li>
</ul>
</body>
</html>
PS : Help -> Toggle Developer Tool , showing no errors, all working ok. i mean : [Extension Host] Change detected
Here is Repo:::
enter image description here
Maybe that it extension bug ? :)
PS:::
!!!Attention!!!
Without iframe tag Index.html .. Live is working well .
But i need iframe.
Is your index.html inside of a folder preceded by a period?
Does your domain look like this? http://127.0.0.1:5500/.folder/index.html
I am trying to convert my simple html document into image. I am using NReco.ImageGenerator for this.
But it does not show included image and styles
I am using Windows 10
Here is my code
var html = File.ReadAllText("main.html");
var htmlToImageConv = new NReco.ImageGenerator.HtmlToImageConverter();
var jpegBytes = htmlToImageConv.GenerateImage(html, "png");
File.WriteAllBytes("image.png", jpegBytes);
It is html document
In browser
My code's output
The problem is that NReco will be unable to find the file of the image in the html.
Two possible solutions that immediately come to mind.
Host the image on a valid URL or use an inline image using base64 encoding in the html.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<link href="style.css" rel="stylesheet">
</head>
<body>
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANwAAADcAQMAAAAhlF3CAAAABlBMVEX///8AAABVwtN+AAABCUlEQVRYhe3XMQ6DMAwF0I8YMuYIHIWjNUfjKByBkQGR2okTUFXaMPMttbR5TJadOIglAgB9YiwrC4iKEzT6GAb5PzvBNa3gRTT0mqn+lL61k8dOvIeSW8ARr1EqkHgfa/NuwCCN+72zH4wlFPP2VlaI//EUWn2X8Vy0TPXylasvTm7HuHR6IhAbMO1kApu9qc3rd8stMW9vegjE2p976tFAbECN4LXyZPwYLLfEA6UVc/rqhAHpT6s+4l+sMcQDbXsjhnIAaLFZ5UnDdulDbMEpJdaumLP+dvY20fB0xTzS54l3MZ8QUeeRMU//RHymr04YxFYszVvnW8svMZYbQI56CcepP4m/8Q15PctBEVIBfQAAAABJRU5ErkJggg==" />
<p class="text">Some text</p>
</body>
</html>
or use a local file url like file:///
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<link href="style.css" rel="stylesheet">
</head>
<body>
<img src="file:///C:/Users/jdarling/Desktop/SO_20190718/images/back.png" />
<p class="text">Some text</p>
</body>
</html>
This is the formal structure of my .cshtml file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dashboard</title>
<link rel="stylesheet" href="~/lib/Hover/hover.css" />
<link rel="stylesheet" href="~/lib/fontawesome/css/font-awesome.css" />
<link rel="stylesheet" href="~/lib/weather-icons/css/weather-icons.css" />
<link rel="stylesheet" href="~/lib/ionicons/css/ionicons.css" />
<link rel="stylesheet" href="~/lib/jquery-toggles/toggles-full.css" />
<link rel="stylesheet" href="~/lib/morrisjs/morris.css" />
<link rel="stylesheet" href="~/lib/select2/select2.css" />
<link rel="stylesheet" href="~/lib/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" />
<link rel="stylesheet" href="~/css/quirk.css" />
<script src="~/lib/modernizr/modernizr.js"></script>
<script>
alert("hello from top");
</script>
</head>
<body style="background:none;">
---Several divs------
<script src="~/lib/jquery/jquery.js"></script>
<script src="~/lib/jquery-ui/jquery-ui.js"></script>
<script src="~/lib/bootstrap/js/bootstrap.js"></script>
<script src="~/lib/jquery-toggles/toggles.js"></script>
<script src="~/lib/morrisjs/morris.js"></script>
<script src="~/lib/datatables/jquery.dataTables.js"></script>
<script src="~/lib/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<script src="~/lib/select2/select2.js"></script>
<script src="~/js/quirk.js"></script>
<script>
alert("hello from bottom");
</script>
</body>
</html>
Actually It's the design provided by our designer, The first alert message from head is popping up successfully so that it's sure javascript is not disabled in my browser, But the last alert is never shown. When I link the external scripts then that also never works either. This is really annoying. I referenced this question and many more in stackoverflow, But nothing solved.
How can I find out what actually happened here ? Is it because some error in previous js files ? OR it's because of old html4 ? There is nothing in my Action method except return View(); statement so that I think it's not necessary to post.
One additional thing is I've rendered one partial view using #Html.Action("...") in body, I think it's not the issue because I tried removing it as well. Please guide me, I am a beginner.
It's seems the same mistake I did some months ago. Your page is started from
<!DOCTYPE ...>
<html ...>
means It clarifies that you are not using any master layout page so any kind of #Scripts.Render as given in the answer you referenced won't work in the current situation. Just a simple solution is set Layout to null at the top of the page like,
#{
Layout = null;
...
}
and everything will work fine.
I have a WPF with a browser control that points to a local HTML file.
I have my .html and .css files in a folder labelled WebResources but it seems no matter how I link the stylesheet in the index.html file the styling doesn't show.
My Solutions Explorer
Solution MyProject
-- MyProject
---- Properties
---- References
---- WebResources
---- Index.html
---- Style.css
Index.html
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="WebResources\Style.css" />
<!-- Also Tried "<link rel="stylesheet" href="Full\Path\To\Style.css" /> -->
</head>
<body>
<div class="container">
<h1>This should be very big</h1>
</div>
</body>
</html>
Style.css
h1 {
font-size: 10em;
}
If index.html and Style.css are in the same folder you should use:
<link rel="stylesheet" href="Style.css" />
I just tried with a test app and it works well.
Let me know.
Have you tried forward-slashes (/)? html pages usually reference other resources with these rather than Windows-style back-slashes
I´ve downloaded tweeter bootstrap (not the bootststrap for MVC) to a brand new MVC4 project, but I can´t make it work.
No errors in browser´s F12 window.
Here is my _layout code:
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="#Url.Content("~/Content/bootstrap-theme.min.css")" rel="stylesheet" media="screen">
</head>
<body>
<script src="#Url.Content("~/Scripts/jquery-2.0.3.min.js")"></script>
<script src="#Url.Content("~/Scripts/bootstrap.min.js")"></script>
<h1>Hello, world!</h1>
#RenderBody()
</body>
</html>
When the screen pops up, I get a normal Hello, world! body (no bootstrap fonts). My system has the following files:
What may I be doing wrong?
You only included the bootstrap-theme.min.css file and not the base bootstrap.css file. (though you did include the bootstrap.js file)