html – 字体在photoshop和网站上看起来不同

前端之家收集整理的这篇文章主要介绍了html – 字体在photoshop和网站上看起来不同前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
简单的问题:为什么这两种字体在photoshop和网站上看起来不同.

在这张照片 – 第一个文本来自HTML代码,第二个是来自photoshop的图像.相同的字体,相同的大小 – 30.但这第一个看起来比第二个更“大胆”.为什么?我想拥有与photoshop相同的字体(第二张图片).

这里是css代码

@font-face {
font-family: "SegoeWP";
src: url("fonts/play/SegoeWP.eot");
src: url("fonts/play/SegoeWP.eot?#iefix")
         format("embedded-opentype"),url("fonts/play/SegoeWP.woff") format("woff"),url("fonts/play/SegoeWP.ttf") format("truetype"),url("fonts/play/SegoeWP.svg#PlayRegular") format("svg");
font-weight: lighter;
}

#strona {
  width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

#Section1 
{
      font-family: "SegoeWP",Tahoma,Arial,sans-serif;
      font-size: 30px; 
}



header,footer,article,section,hgroup,nav,figure {
    display: block;
}


 body {
  font-family: "SegoeWP",sans-serif;
  background-image:url('background.jpg');
  background-repeat: no-repeat;
  background-position: top center;
  color: #ffffff;

 }

HTML代码.

<section id="Section1">  { mywebsite.NET } </section>
  <img src="mojeportfolio.png" />

有任何想法吗?问候!

更多

我发现,我在文件夹中有3种类型的SegoeWP字体. “SegoeWP”,“SegoeWP-Light”,“SegoeWP-Semibold”. “SegoeWP”看起来有些“大胆”,但是这款“SegoeWP-Light”非常完美,看起来和我在双击时的照片相同.我怎样才能在我的网站上使用它?当我改变这部分时 – > url(“fonts / play / SegoeWP-Light.*”),网站没什么变化.怎么了?

解决方法

photoshop处理字体的方式与网页浏览器有很大不同…因为photoshop使用的是平滑,内核等功能,在浏览器中字体几乎总是不同

猜你在找的HTML相关文章