我想通过点击链接更改页面的CSS [关闭]

问题描述 投票:-7回答:4

所以我想制作不同版本的我的网站(颜色明智),如果可能的话只有html和css。

如果有人点击图标,页面的颜色会改变网站:ibrepository.com,我怎么做到这一点

html css
4个回答
0
投票

你可以使用jQuery的.css()函数来实现。

$(function() {

  $("#myAnchor").click(function() {
    $("#someDiv").css("color", "yellow");
  });

});
<!DOCTYPE html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>

  <a href="#" id="myAnchor">Click here </a>

  <div id="someDiv">
    Hello World
  </div>

</body>

</html>

Working DEMO here


0
投票

最好的方法是使用javascript。

在这里看到这个例子:https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_style_create_elmnt


0
投票

您可以使用JavaScript和JQuery执行此操作,如上所述,但如果您希望使用SIMPLEST,而不是最佳方式,只需创建另一个克隆的HTML页面并提供要更改单独类的元素并根据需要更改类CSS页面。然后将链接添加到该页面作为按钮,或者在您的情况下添加您希望CSS在单击时更改的按钮。

编辑:这不需要Java或JQuery。


0
投票

我推荐javascript方法;但是,如果你正在寻找其他选择...注意:这不是我如何设置它;然而,试图给你一个接近你的实际要求的答案。您要求使用JUST css和html编辑此方法。

用php

创建页面和css文件。使用链接更改网址。 page.php?color=yellow

使用$_GET检索颜色并使用php包含颜色样式表

<link rel="stylesheet" type="text/css" href="css/<?php echo $_GET['color'] ?>.css">

这将允许您仅使用css来修改颜色。您只是使用PHP链接到正确的文件。

没有PHP

如果您的内容没有任何改变,这是一个选项。不是一个好的,但它是使用JUST html / css完成它的唯一方法

  1. 创建您的初始页面,创建您的初始CSS。
  2. 复制两者并将它们重命名为颜色。
  3. 使用链接来物理更改页面。内容保持不变,但颜色会有所不同。
© www.soinside.com 2019 - 2024. All rights reserved.