html - 链接到外部样式表以即时查看更新

标签 html css

我们正在查看一个外部网站 example.com。

我想创建一个临时开发环境,我可以在其中更新计算机上的样式表并查看实际实时站点上的更改。

我可以只使用检查元素功能,但如果我不小心刷新了怎么办。

我在我的公共(public)保管箱文件夹中添加了一个样式表。该文件夹链接到我的桌面,因此每次我将 .css 文件保存在我的计算机上时,它都会同步到我的公共(public)保管箱文件夹 - 对样式表的编辑是实时的。

然后我使用 chrome 中的检查元素功能编辑了 html。我在 <head> 中编辑了 html部分并添加了以下行:

<link rel="stylesheet" type="text/css" media="all" href="https://dl.dropboxusercontent.com/u/18083818/stylegavin.css">

我曾预计我屏幕上的网站会更新 - 没有出现任何更新。
  • 我的动态查看 css 编辑的方法是最好的方法吗?
  • 当我链接到头部的样式表时,为什么在实时站点上看不到我的更改?

  • 这是通过检查元素添加的样式表的图片:
    enter image description here

    最佳答案

    这是检查样式表是否按照您希望的方式工作的好方法,但是您使用什么软件来开发网站?织梦者?如果是这样的话,Dreamweaver 有一个功能可以让您执行此操作,这将更容易和更安全,只要以防万一,无论出于何种原因您的保管箱帐户被盗或样式表被意外删除,那么至少您可以通过监控您的更改FTP 帐户。

    对于您的第二个问题:您可能需要刷新页面才能看到效果,因为保管箱可能需要一些时间才能将此新文件同步到其服务器。

    我还可以指出您的 CSS:a#header-links-blue-button.button.hblue-button可能难以工作,因为您已正确声明您正在使用 <a> 定义一个 id 选择器标签,但你也使用了.在查找类和 ID 时可能会混淆浏览器的名称。通常最好不要使用 .#在类和 id 选择器的名称中。

    关于html - 链接到外部样式表以即时查看更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23919433/

    相关文章:

    jquery - 为什么这个 div/area 滚动正确?

    css - Jekyll博客文章:居中图像

    css - 如何使用 Less 编译器将十六进制颜色转换为 rgba?

    jquery - 当选择同级按钮时,取消选择其他按钮(从其他按钮中删除类(class))

    javascript - 当fontWeight不起作用时,如何使HTML5字体变浅?

    javascript - 如何在 HTML 中切换男性、女性单选按钮

    android - @font-face 字体在所有 Android 版本上的呈现不一致

    html - 将hr栏与CSS菜单栏对齐

    html - flexbox网格布局,图片下方带有标题

    javascript - 从 aspx.cs 调用 ASP.NET Master Page (.Master) 函数