草庐IT

background-clip

全部标签

javascript - 如何设置 span background-color 以便它像在 div 中一样为整行背景着色(显示 : block; not an option)

我需要在前置元素中设置一些文本的样式。为此,我使用这样的内联跨度元素:sometextandsometextwithadifferentbackgroundandsomemoretext然后呈现html,仅在文本下方更改了span-elements背景。是否有可能在不将显示更改为block或内联block的情况下使背景颜色延伸到整行。或者有没有办法用javascript实现这个? 最佳答案 您可以通过以不同方式设置文本格式来实现这一点。我已经通过以下方式实现了我相信您正在寻找的东西:sometextandsometextwithad

javascript - 谷歌浏览器包应用程序 : How to make transparent rounded background like google hangout app?

如下图所示,环聊应用是完全透明的,并且还应用了背景阴影。我尝试了几种方法,但没有成功,将css样式应用于页面的“html”和“body”标记,并在创建新窗口时使用“frame:none”选项,但它不起作用。如何制作这样的谷歌浏览器包应用程序?有人知道吗?这是我正在试验的代码。ma​​infest.json:{"manifest_version":2,"name":"DemoApp","version":"0.1","description":"DemoPurpose","app":{"background":{"scripts":["background.js"]}},"permiss

javascript - 谷歌浏览器包应用程序 : How to make transparent rounded background like google hangout app?

如下图所示,环聊应用是完全透明的,并且还应用了背景阴影。我尝试了几种方法,但没有成功,将css样式应用于页面的“html”和“body”标记,并在创建新窗口时使用“frame:none”选项,但它不起作用。如何制作这样的谷歌浏览器包应用程序?有人知道吗?这是我正在试验的代码。ma​​infest.json:{"manifest_version":2,"name":"DemoApp","version":"0.1","description":"DemoPurpose","app":{"background":{"scripts":["background.js"]}},"permiss

html - 什么在搜索引擎中会被索引得更好 : img tags or background-images with screenreader tags?

在构建响应式网站时,我有时会使用背景图像来为适当的屏幕尺寸呈现适当的图像。例如:#image{background-image:url(largeimage.jpg);}@mediaonlyscreenand(max-width:320px){#image{background-image:url(smallimage.jpg);}}为了让屏幕阅读器知道我们正在处理哪种元素,我添加了role="img"还有一个aria-label这是我的问题:我一直了解到,SEO最好在实际图像元素中添加公司Logo等图像。例如原因是当谷歌图片搜索公司名称时,Logo会出现。(假设网站排名足够好)当作为

html - 什么在搜索引擎中会被索引得更好 : img tags or background-images with screenreader tags?

在构建响应式网站时,我有时会使用背景图像来为适当的屏幕尺寸呈现适当的图像。例如:#image{background-image:url(largeimage.jpg);}@mediaonlyscreenand(max-width:320px){#image{background-image:url(smallimage.jpg);}}为了让屏幕阅读器知道我们正在处理哪种元素,我添加了role="img"还有一个aria-label这是我的问题:我一直了解到,SEO最好在实际图像元素中添加公司Logo等图像。例如原因是当谷歌图片搜索公司名称时,Logo会出现。(假设网站排名足够好)当作为

html - 全宽 :hover background for nested lists?

下面截取的html呈现了一个嵌套的元素列表。悬停(鼠标悬停)时,元素背景颜色会发生变化。但是左边的空格没有着色(由于缩进)。我怎样才能让那个空间也被着色?我尝试将absolute定位元素添加到li元素中,并使用left:0。但是那些部分隐藏了li元素的内容:/ul{list-style:none;padding:0;margin:0}li{margin:0;padding:0;padding-left:20px;}li>div:hover{background-color:#eee}RootAAAABBBABB 最佳答案 您可以使用

html - 全宽 :hover background for nested lists?

下面截取的html呈现了一个嵌套的元素列表。悬停(鼠标悬停)时,元素背景颜色会发生变化。但是左边的空格没有着色(由于缩进)。我怎样才能让那个空间也被着色?我尝试将absolute定位元素添加到li元素中,并使用left:0。但是那些部分隐藏了li元素的内容:/ul{list-style:none;padding:0;margin:0}li{margin:0;padding:0;padding-left:20px;}li>div:hover{background-color:#eee}RootAAAABBBABB 最佳答案 您可以使用

html - "background-size: cover"没有覆盖手机屏幕

我的网站上有一个照片背景,使用background-size:cover。它在大多数情况下都有效,但在纵向模式下在我的GalaxyS3上留下了一个奇怪的~30px空白区域。我附上了截图。1px的蓝绿色线条用于说明整个屏幕。似乎背景在社交媒体ul之后立即停止。我通过删除ul和背景将其附加到标语文本的底部来对此进行测试。另外,这是我关于移动端View的CSS:@mediaonlyscreenand(max-width:480px){.logo{position:relative;background-size:70%;-webkit-background-size:70%;-moz-bac

html - "background-size: cover"没有覆盖手机屏幕

我的网站上有一个照片背景,使用background-size:cover。它在大多数情况下都有效,但在纵向模式下在我的GalaxyS3上留下了一个奇怪的~30px空白区域。我附上了截图。1px的蓝绿色线条用于说明整个屏幕。似乎背景在社交媒体ul之后立即停止。我通过删除ul和背景将其附加到标语文本的底部来对此进行测试。另外,这是我关于移动端View的CSS:@mediaonlyscreenand(max-width:480px){.logo{position:relative;background-size:70%;-webkit-background-size:70%;-moz-bac

html - 图像作为绘制形状的 'background'

是否可以用图像而不是颜色“填充”HTML5Canvas上的形状?我画了一堆形状(各个角以45度角切掉的正方形)。我希望能够用图像而不是颜色来“填充”这些形状。目前我有一行说明:context.fillStyle='#123456'//examplefillcolor我正在寻找的是这样的东西:context.fillStyle='url(http://www.myimagereference.com/image.png)';我知道我不能以这种方式使用fillStyle-但是否有另一种方式来实现这种事情? 最佳答案 您可能想看看crea