小编Bar*_*kse的帖子
@ font-face字体在Safari和Chrome中显示在Mac上模糊
我在我的网站上使用两种特殊字体作为标题和副标题.它们在IE,Firefox和Chrome的PC上运行良好.但是,在Safari和Chrome的Mac上,字体显得粗壮且略显模糊.我使用的特定字体是Utopia和Helvetica Neue Condensed Bold.我使用基于otf文件的font squirrel生成了字体工具包.我正在使用font squirrel生成的CSS.您可以在http://shapecast.benmango.co.uk上看到该网站.我还有截图,比较Mac和PC的不同浏览器中的结果:
我用于CSS的代码是:
@font-face {
font-family: 'Utopia';
src: url('/fonts/utopiastd-regular-webfont.eot');
src: url('/fonts/utopiastd-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/fonts/utopiastd-regular-webfont.woff') format('woff'),
url('/fonts/utopiastd-regular-webfont.ttf') format('truetype'),
url('/fonts/utopiastd-regular-webfont.svg#Utopia') format('svg');
font-weight: normal;
font-style: normal;
font-variant:normal;
}
@font-face {
font-family: 'HelveticaNeueLTStdCnBold';
src: url('/fonts/helveticaneueltstd-bdcn-fs.eot');
}
@font-face {
font-family: 'HelveticaNeueLTStdCnBold';
src: url('/fonts/helveticaneueltstd-bdcn-fs.ttf') format('truetype'),
url('/fonts/helveticaneueltstd-bdcn-fs.svg#HelveticaNeueLTStdCnBold') format('svg');
font-weight: bold;
font-style: normal;
font-variant:normal;
}
我已经在这个问题上工作了几天,而且似乎没有任何进展.当我将Helvetica Neue粗体字体的字体重量从正常变为粗体时,我确实得到了改进.我也尝试将SVG线移到顶部,但这没有用.
奇怪的是,在Mac上的Chrome中,当三个主要面板中的一个悬停在主标题下时,字体变得更加清晰,看起来应该如此.但是在Safari上没有任何区别.
如果有人能提供任何建议,我将不胜感激.
推荐指数
解决办法
查看次数
HTML <img>标记无效
我使用以下简单的HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
<img src="loading.gif" alt="MISSING GIF">
<img src="j.JPG" alt="MISSING JPG">
</body>
</html>
loading.gif并j.jpg与html文件存在于同一目录中.loading.gif显示正常,即8但j.jpg不加载.
当我使用firefix时,两个图像都正确显示.
请帮忙
推荐指数
解决办法
查看次数
如果屏幕大小小于1024px,请运行脚本
我正在我的页面上运行一个脚本,div id="homesplash"当用户滚动时,该脚本会消失600px,如下所示:
$(window).scroll(function() {
if ($(this).scrollTop()>600)
{
$('#homesplash').hide();
}
else
{
$('#homesplash').show();
}
});
我需要弄清楚如何在浏览器宽度大于时运行此脚本1024px.有任何想法吗？
我试图从我在这里找到的相关帖子中实现一些代码,但我不能让它工作,因为我不熟悉编写任何javascript.
谢谢.
推荐指数
解决办法
查看次数
CKEditor 5 工具栏固定位置
当您在 CKEditor 5 classic 中添加长内容时，滚动时工具栏会固定在浏览器窗口的顶部。
但是我有一个固定位置的白色徽标区域，下方有一个菜单栏，工具栏出现在它们上方：
我怎样才能让它留在我的固定标题/导航下？
推荐指数
解决办法
查看次数
css3 border-image的透明png问题
我正在使用border-image具有透明部分的PNG图像.问题是div已经background-color设置了黑色.当我应用时border-radius,图案的透明部分显示div的黑色而不是包含div的元素的背景.
如何border-radius忽略div的颜色.以下是有问题的代码.
HTML
<header>
<div class="outerColumn">
<div class="column clearfix">
<h1>Company</h1>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">My Work</a></li>
<li><a href="#">About me</a></li>
<li><a href="#">Elements</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</div>
</div>
</header>
CSS
body > header {
position:fixed;
top:0;
left:0;
z-index:2;
border-bottom:10px solid #0e0e0e;
-moz-border-image: url(../images/header-background-pattern.gif) 0 0 10 0 repeat;
-webkit-border-image: url(../images/header-background-pattern.gif) 0 0 10 0 repeat;
border-image: url(../images/header-background-pattern.gif) 0 0 10 0 repeat;
}
header, footer {
width:100%;
background-color:#0e0e0e;
clear:both;
}
推荐指数
解决办法
查看次数
当我将鼠标悬停在按钮上时，为什么这个阴影不会消失？
我正在使用 CSS 来设计一些按钮的样式。我想用阴影制作白色块，当你悬停在它上面时，我想让阴影消失。这是我正在使用的 CSS。
#mainMenu li a:link, #mainMenu li a:visited {
font-family: sans-serif;
display:block;
color: #000;
width:;
height:40px;
text-decoration: none;
/* top right bottom left */
background:#FFF;
padding: 0 30px 0 30px;
margin-right: 20px;
line-height: 40px;
/* DROP Shadow */
-moz-box-shadow: 3px 3px 4px #000;
-webkit-box-shadow: 3px 3px 4px #000;
box-shadow: 3px 3px 4px #000;
}
/* Change this to add images to buttons for rollover*/
#mainMenu li a:hover, #mainMenu li a:active {
font-family: sans-serif;
display:block;
color: #000;
width:;
height:40px; …推荐指数
解决办法
查看次数
如何在Visual Studio代码中格式化HTML
我试过了:
- ALT+ SHIFT+F
- CTRL+ K,CTRL+D
- CTRL+ K,CTRL+F
此外,当我通过CTRL+ SHIFT+ 搜索格式时P,没有搜索结果.
推荐指数
解决办法
查看次数
如何禁用叠加层上的点击以关闭Colorbox？
我想在cboxOverlay点击时阻止colorbox关闭
我正在使用此代码:
$.fn.colorbox({ overlayClose: false });
但它不起作用.
我也禁用Esc关闭
$(document).bind("keydown.cbox_close", function (e) {
if (e.keyCode === 27) {
e.preventDefault();
cboxPublic.close();
}});
Esc代码正常工作.
但如何防止彩盒关闭覆盖？
谢谢
推荐指数
解决办法
查看次数
我可以在jquery悬停上更改图像吗？
我有这个大图像显示,在底部我有小图像,我希望大图像到我正在盘旋的图像,如果可能的话.谢谢.
这是我的代码.
<div class="wrapper">
<div class="inner">
<img src="img/1.png" alt="image 1">
</div>
<ul class="small">
<li> <img src="img/1.png" alt="image 2"> </li>
<li> <img src="img/2.png" alt="image 2"> </li>
<li> <img src="img/3.png" alt="image 2"> </li>
<li> <img src="img/4.png" alt="image 2"> </li>
<li> <img src="img/5.png" alt="image 2"> </li>
</ul>
</div>
这是我的jquery但不起作用.
<script type="text/javascript">
$(document).ready(function() {
$('.small').hover(function() {
$('.inner img').attr('src' = '.small img src')
});
});
</script>
推荐指数
解决办法
查看次数
如何在HTML页面中停止tab键的默认操作
在我的HTML页面中存在多个组件,在按Tab键按钮时,焦点设置为某些组件(不按顺序).如何阻止标签将焦点放在整个页面上的任何组件上？使用最外层div id的html页面我们可以阻止选项卡将焦点放在任何组件和位置栏上吗？
我已经添加了jsfiddle (demo),即使我没有使用tabindex,但仍然专注于告诉我如何禁用tab click.
$(document).on('keydown', function(event) {
if (event.keyCode == 9) { //tab pressed
event.preventDefault(); // stops its action
}
});
推荐指数
解决办法
查看次数
角度4的ngx光滑轮播无法移动
我是新手，我想制作这样的旋转木马，其中央有活动项，如下所示：
我已经读过角度为2或更高的光滑轮播
我尝试复制该示例，并按照说明进行操作，但出现此错误：
错误TypeError：$（...）。slick不是函数
- 我已经添加了模块并将其导入到我的
app.module 我已经添加了CSS和JS
angular-cli.json
Run Code Online (Sandbox Code Playgroud)"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.min.css", "theme.scss", "../node_modules/font-awesome/css/font-awesome.css", "../node_modules/slick-carousel/slick/slick.css", "../node_modules/slick-carousel/slick/slick-theme.css" ], "scripts": [ "../node_modules/jquery/dist/jquery.min.js", "../node_modules/bootstrap/dist/js/bootstrap.min.js", "../node_modules/slick-carousel/slick/slick.js" ],
这是我的模块：
...
import { SlickModule } from 'ngx-slick';
import { SliderComponent } from './home/slider/slider.component';
@NgModule({
declarations: [
... ,
SliderComponent,
],
imports: [
... ,
SlickModule.forRoot()
],
providers: [...],
bootstrap: [AppComponent]
})
export class AppModule { }
这是我的看法：
<h2>slider here </h2>
<ngx-slick class="carousel" #slickModal="slick-modal" [config]="slideConfig"
(afterChange)="afterChange($event)">
<div ngxSlickItem *ngFor="let slide of slides" class="slide">
<img src="{{ …推荐指数
解决办法
查看次数
标签 统计
html ×5
javascript ×4
css ×3
jquery ×3
angular ×1
cakephp-2.0 ×1
carousel ×1
ckeditor ×1
ckeditor5 ×1
colorbox ×1
css-position ×1
css3 ×1
font-face ×1
html5 ×1
image ×1
jquery-hover ×1
php ×1
png ×1
slick ×1
slideshow ×1
transparency ×1
typescript ×1
xhtml ×1