使用自定义CSS标签显示HTML文件？

发布于 2025-01-21 11:25:15 字数 2295 浏览 0 评论 0原文

我有一个非常大的树菜单，总是相同的。是否可以创建一个自定义CSS属性（我不知道技术术语），以便我可以在HTML文件中创建菜单，并且在每个页面的源代码中仅键入几个字符以使其出现？类似的东西：

// index.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">
<css_nav_thing><!-- Nav menu appears here --></css_nav_thing>
</div>

<div class="content_div">content stuff here</div>
</body>
</html>

//菜单.html

<html>
<head>
<link type="text/css" src="nav_menu_style.css" />
<script src="nav.js"></script>
</head>
<body>
<div class="nav">
<li>'s and <ul>'s that create the links for a navigation menu </li>'s and </ul>'s
</div>
</body>
</html>

// page_style.css

body {
   body stuff
}

css_nav_thing {
   src: (url="menu.html")
   position: stuff;
   margin: stuff'
   
}

.content_div {
   position: stuff;
   margin: stuff;
   andstuf: stuff;
}

// nav_menu_style.css

body {
   stuff: stuff;
]

a {
   color: #374;
   andstuff: stuff;
}

// content_page.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<css_nav_thing>
<!-- Nav menu appears here -->
</css_nav_thing>

</div>

<div class="content_div">content stuff here</div>
</body>
</html>

// some_other_content_page.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<css_nav_thing>
<!-- Nav menu appears here -->
</css_nav_thing>

</div>

<div class="content_div">content stuff here</div>
</body>
</html>

或我们可以用a ＆ltc; link; link>＆lt;菜单。html“ /＆gt; < /code>标签与复制/粘贴所有菜单的Li和UL在每个页面上相比，将相同的菜单添加到一堆页面上是否可以使这可能使这一菜单更容易？我正在建立的网站将有数百页。哇，如果我可以使可能的话更轻松，更快！

如果有可能...我该怎么做？

原文

I have a very large tree menu that will always be the same. Is it possible to create a custom css attribute (I don't know the technical term) so I can create the menu in an html file and only type a few characters in every page's source code to make the appear? Something like this:

// index.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">
<css_nav_thing><!-- Nav menu appears here --></css_nav_thing>
</div>

<div class="content_div">content stuff here</div>
</body>
</html>

// menu.html

<html>
<head>
<link type="text/css" src="nav_menu_style.css" />
<script src="nav.js"></script>
</head>
<body>
<div class="nav">
<li>'s and <ul>'s that create the links for a navigation menu </li>'s and </ul>'s
</div>
</body>
</html>

// page_style.css

body {
   body stuff
}

css_nav_thing {
   src: (url="menu.html")
   position: stuff;
   margin: stuff'
   
}

.content_div {
   position: stuff;
   margin: stuff;
   andstuf: stuff;
}

// nav_menu_style.css

body {
   stuff: stuff;
]

a {
   color: #374;
   andstuff: stuff;
}

// content_page.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<css_nav_thing>
<!-- Nav menu appears here -->
</css_nav_thing>

</div>

<div class="content_div">content stuff here</div>
</body>
</html>

// some_other_content_page.html

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<css_nav_thing>
<!-- Nav menu appears here -->
</css_nav_thing>

</div>

<div class="content_div">content stuff here</div>
</body>
</html>

Or can we do this with a <link src="menu.html" /> tag???
Is this possible to make adding the same menu to a bunch of pages easier than copy/pasting all of the menu's li's and ul's in to every single page? The site I'm building's going to have hundreds of pages. Hooray if I can make it easier and faster to do if this is possible!

If it is possible...how would I do it?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

冷情 2025-01-28 11:25:15

使用jQuery

。

<html>
<head>
<link type="text/css" src="nav_menu_style.css" />
<script src="nav.js"></script>
</head>
<body>
<div class="nav">
<li>'s and <ul>'s that create the links for a navigation menu </li>'s and </ul>'s
</div>
</body>
</html>

<html> 
  <head> 
   </head> 
<body> 
     <div id="includedContent"></div>

    //some_other_content_page.html content

 <script src="jquery.js"></script> 
    <script> 
 $(function(){
      $("#includedContent").load("menu.html"); 
    });
    </script> 
  </body> 
</html>

菜单 >

。load（）文档

Use Jquery

menu.html

<html>
<head>
<link type="text/css" src="nav_menu_style.css" />
<script src="nav.js"></script>
</head>
<body>
<div class="nav">
<li>'s and <ul>'s that create the links for a navigation menu </li>'s and </ul>'s
</div>
</body>
</html>

some_other_content_page.html

<html> 
  <head> 
   </head> 
<body> 
     <div id="includedContent"></div>

    //some_other_content_page.html content

 <script src="jquery.js"></script> 
    <script> 
 $(function(){
      $("#includedContent").load("menu.html"); 
    });
    </script> 
  </body> 
</html>

Download Jquery

.load() documentation

回复收藏 0 原文

浪推晚风 2025-01-28 11:25:15

我会命名您的菜单菜单。php，然后您可以在下面做。这始终对我有用，您可以随时在任何分开的幻灯片，画廊，或者真正想在特定页面中插入的任何内容来执行此操作。

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<--THIS IS WHERE YOUR MENU GO-->
          <?php include 'menu.php';?>
</div>

<div class="content_div">content stuff here</div>
</body>
</html>

I would name your menu menu.php then you can do below. This always works for me and you can always do this on any separated slides or gallery or whatever really you want to insert inside a particular page.

<html>
<head>
<title>Example of what I mean></title>
<link type="text/css" src="page_style.css" />
</head>

<div class="navigation_div">

<--THIS IS WHERE YOUR MENU GO-->
          <?php include 'menu.php';?>
</div>

<div class="content_div">content stuff here</div>
</body>
</html>

回复收藏 0 原文

~没有更多了~