草庐IT

css-flexbox

全部标签

html - CSS:搜索框将使用 Flexbox 根据窗口大小自动调整大小

我想设计一个布局如下图:在这个布局中,这是我的标题。黑色矩形是一些固定宽度的组件(按钮,链接...),红色矩形是我的搜索表单。我希望当用户改变浏览器窗口的大小时,搜索表单会变小(宽度),直到某个值,才会出现水平滚动条。也许困难的部分是:我不知道如何解决css中的“自动调整大小”。这是我的示例代码:我的HTML:TitleHereHomeNotificationsProfileAddQuestion我的CSS:.html{box-sizing:border-box;font-family:"HelveticaNeue",Helvetica,Arial,sans-serif;}*,*:be

html - CSS:搜索框将使用 Flexbox 根据窗口大小自动调整大小

我想设计一个布局如下图:在这个布局中,这是我的标题。黑色矩形是一些固定宽度的组件(按钮,链接...),红色矩形是我的搜索表单。我希望当用户改变浏览器窗口的大小时,搜索表单会变小(宽度),直到某个值,才会出现水平滚动条。也许困难的部分是:我不知道如何解决css中的“自动调整大小”。这是我的示例代码:我的HTML:TitleHereHomeNotificationsProfileAddQuestion我的CSS:.html{box-sizing:border-box;font-family:"HelveticaNeue",Helvetica,Arial,sans-serif;}*,*:be

html - 标题标签的默认 CSS 样式是什么? (H1, h2, h3, h4, h5)

在HTML中,标题用表示(1,2,3,4,5,6)标签。我的问题是关于以下HTML代码:RegistrerBruker而不是写,我想在CSS中编写类的属性;给出相同的字体大小(外观和感觉);标题HTML给出。CSS中是否也有相同的预定义属性? 最佳答案 答案是否定的,但是您可能会修改样式。大多数浏览器会尝试使用这些样式(取自:w3schools)h1{display:block;font-size:2em;margin-top:0.67em;margin-bottom:0.67em;margin-left:0;margin-righ

html - 标题标签的默认 CSS 样式是什么? (H1, h2, h3, h4, h5)

在HTML中,标题用表示(1,2,3,4,5,6)标签。我的问题是关于以下HTML代码:RegistrerBruker而不是写,我想在CSS中编写类的属性;给出相同的字体大小(外观和感觉);标题HTML给出。CSS中是否也有相同的预定义属性? 最佳答案 答案是否定的,但是您可能会修改样式。大多数浏览器会尝试使用这些样式(取自:w3schools)h1{display:block;font-size:2em;margin-top:0.67em;margin-bottom:0.67em;margin-left:0;margin-righ

html - CSS 覆盖 rgba 透明度

div{background:rgba(0,255,255,0.3);}#div1{width:300px;height:300px;}#div2{width:200px;height:200px;}div2的实际计算透明度是多少?我很困惑。是一个未知数,不是0.3+0.3,也不是0.3+0.3*0.3 最佳答案 alphachannel的总和可以计算为:alpha_top+alpha_bottom*(1-alpha_top)=0.3+0.3*(1-0.3)=0.3+0.3*0.7=0.3+0.21=0.51有关更多说明,请参阅Al

html - CSS 覆盖 rgba 透明度

div{background:rgba(0,255,255,0.3);}#div1{width:300px;height:300px;}#div2{width:200px;height:200px;}div2的实际计算透明度是多少?我很困惑。是一个未知数,不是0.3+0.3,也不是0.3+0.3*0.3 最佳答案 alphachannel的总和可以计算为:alpha_top+alpha_bottom*(1-alpha_top)=0.3+0.3*(1-0.3)=0.3+0.3*0.7=0.3+0.21=0.51有关更多说明,请参阅Al

HTML/CSS : What should I use to define image height/width to make it resolution independent?

我在互联网上读到过我不应该用绝对像素高度/宽度/大小定义字体(或任何东西),而是使用EM...以便在更高分辨率的显示器上,我的网站可以适当扩展。但是,我用什么来定义图像的高度/宽度...因为图像不能很好地缩放(它们看起来像素化)更新:澄清一下,我不是指的是页面缩放。我指的是如何使我的Web应用程序分辨率独立,以便它在更高DPI显示器上看起来正确。 最佳答案 我知道这个问题有点老了,但我想把它放在那里供以后出现的任何人使用。当谈论具有更高像素密度的移动设备时,移动浏览器会将页面放大一定量,使其看起来好像网页不是很小。设备根据CSS2.

HTML/CSS : What should I use to define image height/width to make it resolution independent?

我在互联网上读到过我不应该用绝对像素高度/宽度/大小定义字体(或任何东西),而是使用EM...以便在更高分辨率的显示器上,我的网站可以适当扩展。但是,我用什么来定义图像的高度/宽度...因为图像不能很好地缩放(它们看起来像素化)更新:澄清一下,我不是指的是页面缩放。我指的是如何使我的Web应用程序分辨率独立,以便它在更高DPI显示器上看起来正确。 最佳答案 我知道这个问题有点老了,但我想把它放在那里供以后出现的任何人使用。当谈论具有更高像素密度的移动设备时,移动浏览器会将页面放大一定量,使其看起来好像网页不是很小。设备根据CSS2.

html - 如何使用 CSS 仅设置一种类型的输入字段而不影响其他输入类型

有没有一种方法可以编写只影响文本字段的样式规则。假设我有以下内容:div#helloDivinput{border:1pxsolidred;}上述CSS规则的问题在于它会影响所有输入字段,不仅是输入文本,还会影响单选按钮、提交按钮等。那么是否有跨浏览器的解决方案来影响div或其他页面元素中的一种类型的输入字段(无需诉诸单独分配输入字段样式)。 最佳答案 最繁琐但与IE6兼容的方法是为所有inputtype="text"元素提供一些特定的CSS类,例如class="text",并仅针对该类:div#helloDivinput.text

html - 如何使用 CSS 仅设置一种类型的输入字段而不影响其他输入类型

有没有一种方法可以编写只影响文本字段的样式规则。假设我有以下内容:div#helloDivinput{border:1pxsolidred;}上述CSS规则的问题在于它会影响所有输入字段,不仅是输入文本,还会影响单选按钮、提交按钮等。那么是否有跨浏览器的解决方案来影响div或其他页面元素中的一种类型的输入字段(无需诉诸单独分配输入字段样式)。 最佳答案 最繁琐但与IE6兼容的方法是为所有inputtype="text"元素提供一些特定的CSS类,例如class="text",并仅针对该类:div#helloDivinput.text