bootstrap 网页中代码显示<code><pre>用法

最新推荐文章于 2024-07-26 19:30:00 发布

hichinamobile

最新推荐文章于 2024-07-26 19:30:00 发布

阅读量4.9k

点赞数

分类专栏： bootstrap

本文链接：https://blog.csdn.net/hichinamobile/article/details/51734802

版权

bootstrap 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了一种在网页中展示代码的方法，包括行内代码及成段代码的显示方式。通过具体的示例展示了如何使用HTML标签如`<code>`和`<pre>`来达到良好的展示效果。同时，还介绍了如何引入Bootstrap等前端框架来进一步美化页面。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

网页中代码的显示，包括行中代码显示；成段的代码显示，效果图如下

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<head>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>质量录入</title>
</head>
<body>
<form action="<%=basePath %>rest/wx" method="post">
<div class="container">
	<h1 class="page-header">代码<small><code><pre>的使用</small></h1>
	<p>Bootstrap是基于<code>HTML5</code>和<code>CSS3</code>开发的，它在jQuery的基础上进行了更为个性化和人性化的完善，形成一套自己独有的网站风格，并兼容大部分jQuery插件。</p>
	<pre>
		<xml>
			<ToUserName>mycreate</ToUserName>
			<FromUserName>wx5823bf96d3bd56c7</FromUserName>
			<CreateTime>1348831860</CreateTime>
			<MsgType>text</MsgType>
			<Content>this is a test</Content>
			<MsgId>1234567890123456</MsgId>
			<AgentID>128</AgentID>
		</xml>
	</pre>
	<pre>
			DocumentBuilderFactory dbf = DocumentBuilderFactory.newInstance();
			DocumentBuilder db = dbf.newDocumentBuilder();
			StringReader sr = new StringReader(sMsg);
			InputSource is = new InputSource(sr);
			Document document = db.parse(is);

			Element root = document.getDocumentElement();
			NodeList nodelist1 = root.getElementsByTagName("Content");
			String Content = nodelist1.item(0).getTextContent();
			System.out.println("Content：" + Content);
	</pre>
	
</div>
</form>
</body>
</html>