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">

我原以为我屏幕上的网站会更新 - 没有出现更新。

  1. 我的即时查看 CSS 编辑的方法是最好的方法吗?
  2. 当我链接到 head 中的样式表时,为什么我的更改没有出现在实时网站上?

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

最佳答案

这是检查样式表是否按照您希望的方式工作的好方法,但是您使用什么软件开发网站?织梦机?如果是这样,Dreamweaver 有一项功能可以让您更轻松、更安全地执行此操作,以防万一,无论出于何种原因,您的 Dropbox 帐户遭到泄露,或者如果样式表被意外删除,那么至少您可以通过FTP 帐户。

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

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

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

相关文章:

html - 从 html 链接中的 Azure 存储下载

html - 动态创建的表格在非IE浏览器中显示无效

javascript - 设置为多个值时获取单个框阴影的值

javascript - 从下拉列表一中选择,根据下拉列表一中的值删除选择选项

javascript - 平滑的背景图像过渡 - Javascript

javascript - 具有相同类的动态元素

css - 让div运行到屏幕右侧

css - 在 CSS 中使用负边距或填充是不好的做法

html - 字体在 Mac 上不显示

html - 如何使用 Css3 转换创建站立的 3D 文本效果