草庐IT

css-flexbox

全部标签

html - 如何仅使用 CSS 将图像插入网页?

如何在不使用html的情况下将来自另一个网站的某些图像的url插入到css中?试过这个content:url(url);并且还使用了background-image而不是content。当我在InternetExplorer和Chrome上运行它时,网页上看不到图像。我不允许编辑HTML代码。 最佳答案 使用.className{background-image:url('yoururlhere');width:500px;//useyourpixelsheight:500px;}DEMO

html - 带边框的 CSS 跨度

嗨,我不明白为什么我的带边框的span看起来像这样这是背后的csscolor:red;font-size:12px;background-color:#ffcaca;background-image:url(/Content/x.png);background-size:20px20px;background-repeat:no-repeat;background-position:2px;padding:5px;border-radius:5px5px5px;border:1pxsolidred;padding-left:25px;position:relative;和html[..

html - 带边框的 CSS 跨度

嗨,我不明白为什么我的带边框的span看起来像这样这是背后的csscolor:red;font-size:12px;background-color:#ffcaca;background-image:url(/Content/x.png);background-size:20px20px;background-repeat:no-repeat;background-position:2px;padding:5px;border-radius:5px5px5px;border:1pxsolidred;padding-left:25px;position:relative;和html[..

html - CSS 字体最佳实践

我试图在我正在使用和学习的CSS模板中理解这个字体声明。大多数CSS教程不会以这种方式设置字体大小。它似乎确实有效,我只是想知道到底发生了什么。body{font:30015px/1.4'HelveticaNeue',Helvetica,Arial,sans-serif;}300号码在做什么?为什么创作者会使用15px/1.4的一小部分而不是仅仅放置10px之类的东西?另外,什么时候在字体上使用引号合适,什么时候不合适? 最佳答案 它是以下内容的简写语法:font-weight:300;font-size:15px;line-hei

html - CSS 字体最佳实践

我试图在我正在使用和学习的CSS模板中理解这个字体声明。大多数CSS教程不会以这种方式设置字体大小。它似乎确实有效,我只是想知道到底发生了什么。body{font:30015px/1.4'HelveticaNeue',Helvetica,Arial,sans-serif;}300号码在做什么?为什么创作者会使用15px/1.4的一小部分而不是仅仅放置10px之类的东西?另外,什么时候在字体上使用引号合适,什么时候不合适? 最佳答案 它是以下内容的简写语法:font-weight:300;font-size:15px;line-hei

html - 使用 CSS HTML 进行响应式扑克牌设计

我试图创建一个响应显示宽度的扑克牌队列。我希望这个队列适合显示宽度,这样就不会在显示时丢失任何卡片。我想涵盖手机、平板电脑和台式机的常规宽度。我还喜欢将这个队列居中对齐,这样看起来就不会很糟糕。jsfiddlediv{width:100%;}img{display:inline-block;height:200px;}.rest{margin-left:-102px;} 最佳答案 这非常适合新的Flexboxmodel!在包装div上使用display:inline-flex,并在img上移除display:inline-block

html - 使用 CSS HTML 进行响应式扑克牌设计

我试图创建一个响应显示宽度的扑克牌队列。我希望这个队列适合显示宽度,这样就不会在显示时丢失任何卡片。我想涵盖手机、平板电脑和台式机的常规宽度。我还喜欢将这个队列居中对齐,这样看起来就不会很糟糕。jsfiddlediv{width:100%;}img{display:inline-block;height:200px;}.rest{margin-left:-102px;} 最佳答案 这非常适合新的Flexboxmodel!在包装div上使用display:inline-flex,并在img上移除display:inline-block

html - 所有 IE css hack

这个问题在这里已经有了答案:DetectingIEversionusingCSSCapability/FeatureDetection(18个答案)关闭2个月前。是否有适用于所有IE浏览器的csshack。不是特定的IE版本。我试过了@media\0screen\,screen\9{body{background:green;}}但它在IE7和IE11中不起作用。

html - 所有 IE css hack

这个问题在这里已经有了答案:DetectingIEversionusingCSSCapability/FeatureDetection(18个答案)关闭2个月前。是否有适用于所有IE浏览器的csshack。不是特定的IE版本。我试过了@media\0screen\,screen\9{body{background:green;}}但它在IE7和IE11中不起作用。

css - 文本在悬停时改变不透明度时闪烁

我正在尝试做一些非常简单的事情,一个para的不透明度设置为0,当悬停在父div上时,para的不透明度变为1,不透明度发生变化后文本发生变化,它不完全是闪烁,文本有点self调整,这有点奇怪。这是fiddle:http://jsfiddle.net/krish7878/7t6GM/HTML代码:SOMESAMPLETEXTCSS代码:.para{width:1000px;border:1pxsolid#000;}.parap{font-family:Arial,sans-serif;font-size:80px;opacity:0;}.para:hoverp{opacity:1;tr