jquery 3.5.1 mobile css formating not showing in live server preview with vs code
Question
I'm trying to use the jquery css stylesheet, but I can't seem to get it to format anything at all. I'm using the live preview extension in VSCode, and the css is from the jquery website.
<!DOCTYPE html>
<html>
<head>
<title>Physics Simulator App</title>
<link rel="stylesheet" href="css\jquery.mobile-1.4.5.min.css">
<script src="scripts\jquery-3.5.1.min.js"> </script>
<script src="scripts\jquery.mobile-1.4.5.min.js"> </script>
<script type='text/javascript' src='scripts\Week 2 homework.js'> </script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div data-role="page">
<div data-role="navbar">
<ul>
<li><a href="week 1 homework.html"> Information</a> </li>
<li><a href="Week 2 App.html" class="ui-btn-active ui-state-persist"> Interface</a> </li>
</ul>
</div>
<div data-role="header">Binary Operators Demo</div>
<div data-role="content">
<label for="input">A</label>
<input type="checkbox" name="inputA" id="inputA">
<br />
<label for="input">B</label>
<input type="checkbox" name="inputB" id="inputB">
<br />
<button onclick="AND();">AND</button>
<button onclick="OR();">OR</button>
<button onclick="NOT();">NOT</button>
<button onclick="XOR();">XOR</button>
</div>
<table id="data">
<tr>
<td>Result: </td>
<td id="resultA"></td>
</tr>
</table>
<div data-role="footer">
<small>binary operations demo app</small>
</div>
</div>
</body>
</html>
I don't think I'm missing anything in terms of brackets, and the file paths work for my own css files. I've tried adding 'data-theme="a"' to my page bracket, but nada. I just get this. result
Is it a version issue or?
1 answers
solution1
0 2020-10-12 01:46:15
Friend, I may have misunderstood you for not mastering English very well. But as I understand it, your problem is with jquery.mobile.css? Try using the CDN. I copied your code and replaced the with the CDN (I didn't find this Week 2 homework.js). Replace the with the CDN and do this test: Insert this code block:
<div class = "ui-grid-d">
<div class = "ui-block-a">
<a href="#" class="ui-btn ui-corner-all ui-shadow"> button </a> <br>
<span> any info </span>
</div>
</div>
It uses the style of jquery.mobile.css, if it works the problem could be in your import of the files. Two tips, avoid spaces in the file names, (Week 2, it could be Week_2_homework), and in the <label for = ""> do not point " input ", point the name you gave to the input or the id . If I was wrong about your problem, answer that I try to help you. Reggards
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.