zoukankan      html  css  js  c++  java
  • 快速知道网页上文字的字体、大小、颜色代码

          对于网页设计者来说,其他网站上使用的字体有些是十分值得借鉴的,好的字体能大大提高可阅读性和访问感受,虽然可以使用firebug来获得确切的信息,但是花的操作步骤和眼力还是比较多的,而这次介绍的两个firefox扩展可以做到事半功倍的效果。

            由于网页上标题、正文、链接等部分的文字为了区分开来,以及突出重点,所以一般会使用不同的字体以及大小来显示,而firebug每次查找字体信息都要进行选择和从一堆的相关css中提取。经常这样操作非常不可取。所以非常建议大家使用下面两个扩展:

            首先是Context Font

            这个扩展非常简单,它的功能可以方便的知道页面文字使用的是什么字体,字体大小,以及是否进行了加粗、倾斜。。。一个页面上所以不同样式的字体使用十几秒钟就可以全部知道。

            操作方法:使用鼠标选中几个字(链接也可以),然后右击,在右键菜单中就可以看到有关字体的信息了。是不是非常的简单和快速!


            并且点击右键菜单的那个菜单项,字体的名字还会被自动的复制到剪切板上,如果你的css中需要这个字体,现在只要直接粘贴就可以了。

            第二个是Font Finder

            Font Finder这个火狐的扩展比Context Font可以获得信息多很多。并且还可以就地对网页上觉得不好看的字体进行调整,这在网站模板设计的时候非常方便,因为调整是虚拟的,如果改动后不满意,直接刷新就可以还原重来。

            Font Finder也是通过选中文字,然后在右键菜单中选择。不同的是,这个扩展只允许你选中一个字,可能是怕出现一次选中多种字体的情况出现。

             在“copy elements”菜单中,你可以知道字体,大小、颜色等等信息,在跳出的界面上也可以方便的使用鼠标复制这些内容。


            如果觉得显示的字不好看,想要调整,使用“adjust elements”菜单中的调整项吧。最下面的两个菜单还可以禁用网页上的某些字体哦。

            虽然Context Font功能不多,但相比Font Finder操作简单的多,所以建议两个扩展同时安装,这样可以使用最少的步骤得到想要的效果,从而可以把更多的精力花在思考上面。

            如果你想要知道网页上图片中的文字使用了什么字体,那么这两个扩展是办法的,好在软件No1曾经介绍过的“What The Font”在线工具可以做到。

  • 相关阅读:
    bzoj1218 本来dp 但是数据弱 枚举可过
    bzoj1816二分答案 扑克牌
    bzoj2748 水dp
    最长上升子序列(nlog n)
    bzoj1798线段树。。调的要死
    HTML5 移动开发 (HTML5标签和属性)
    关于全屏布局
    关于z-index这个层级的问题
    面板数据模型
    竞争模型
  • 原文地址:https://www.cnblogs.com/zyy711865/p/2801504.html
Copyright © 2011-2022 走看看