程序设计 css

16

我想制作一个position: fixed;以动态宽度和高度为中心的弹出框。我曾经margin: 5% auto;为此。没有position: fixed;它，则水平居中，但不能垂直居中。添加后position: fixed;，它甚至没有水平居中。这是完整的设置： .jqbox_innerhtml { position: fixed; width: 500px; height: 200px; margin: 5% auto; padding: 10px; border: 5px solid #ccc; background-color: #fff; } <div class="jqbox_innerhtml"> This should be inside a horizontally and vertically centered box. </div> 运行代码段隐藏结果展开摘要如何使用CSS在屏幕上将此框居中？

439 css css-position centering

19

为什么CSS可以处理假元素？

在课堂上，我在玩耍，发现CSS可以与虚构元素一起使用。例： imsocool { color:blue; } <imsocool>HELLO</imsocool> 运行代码段隐藏结果展开摘要当我的教授第一次看到我使用此功能时，他对组合元素起作用感到有些惊讶，并建议我将所有组合元素更改为带有ID的段落。为什么我的教授不希望我使用虚构元素？他们有效地工作。另外，他为什么不知道组成元素存在并且可以与CSS一起使用。他们不常见吗？

438 html css

18

禁用引导模态区域之外的单击以关闭模态

我正在制作一个Bootstrap网站，其中包含几个Bootstrap'Modals'。我正在尝试自定义一些默认功能。问题是这样；您可以通过单击背景关闭模态。反正有禁用此功能？仅在特定模态上？引导程序模式页面

438 javascript css twitter-bootstrap modal-dialog

17

如何使用CSS更改SVG图像的颜色（jQuery SVG图像替换）？

Наэтотвопросестьответына 堆栈溢出нарусском 这是我想出的一小段代码的自我问答。当前，没有一种简单的方法可以嵌入SVG图像，然后可以通过CSS访问SVG元素。有多种使用JS SVG框架的方法，但是如果您要做的只是制作带有过渡状态的简单图标，它们将过于复杂。这就是我想出的，我认为这是迄今为止在网站上使用SVG文件的最简单方法。它的概念来自早期的文本到图像替换方法，但据我所知，从未对SVG进行过处理。这是问题：如何在不使用JS-SVG框架的情况下在SVG中嵌入SVG并更改其颜色？

437 jquery css svg

10

具有左，中或右对齐项的Bootstrap NavBar

在Bootstrap中，最简单的平台创建导航栏的方法是在左侧显示徽标A，在中央显示菜单项，在右侧显示徽标B。这是到目前为止我尝试过的方法，最终将它们对齐，以使徽标A位于左侧，菜单项位于徽标旁边，左侧是徽标B。 <div class="navbar navbar-fixed-top navbar-custom "> <div class="container" > <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#"><span class="navbar-logo">Logo_A</span></a> </div> <div class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#about">Menu Item 1</a></li> <li><a href="#contact">Menu Item 2</a></li> <li><a href="#about">Menu Item 3</a></li> …

437 html css twitter-bootstrap bootstrap-4 navbar

5

CSS隐藏滚动条（如果不需要）

我试图弄清楚如何隐藏 overflow-y:scroll;不需要的东西。我的意思是说我正在建立一个网站，并且有一个主要区域将显示帖子，并且如果内容未超过当前宽度，我想隐藏滚动条。另外，我的第二个问题。我想这样做，以便当帖子超过当前宽度时，宽度将自动增加，并且内容不会开箱即用。有人知道如何执行此操作吗？帖子区域： .content { height: 600px; border-left: 1px solid; border-right: 1px solid; border-bottom: 1px solid; font-size: 15px; text-align: justify; line-height: 19px; overflow-y:scroll; } 主网站容器： .container { margin: 0 auto; width: 757px; margin-top: 30px; text-align: center; }

435 html css

20

单击按钮使用jQuery复制到剪贴板

如何将div中的文本复制到剪贴板？我有一个div，需要添加一个链接，该链接会将文本添加到剪贴板。有解决方案吗？ <p class="content">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> <a class="copy-text">copy Text</a> 单击复制文本后，然后按Ctrl+ V，必须将其粘贴。

433 jquery html css

7

是background-color：none有效的CSS吗？

谁能告诉我以下CSS是否有效？ .class { background-color:none; }

431 css background-color

12

在主体上设置的CSS3渐变背景不会拉伸，而是会重复吗？

好的，说里面的内容<body>总计高300像素。如果我设置<body>使用-webkit-gradient或的背景-moz-linear-gradient 然后，我将窗口最大化（或使其高度大于300px），渐变将恰好是300px（内容的高度），然后重复进行以填充窗口的其余部分。我假设这不是错误，因为在webkit和gecko中都是相同的。但是，是否有一种方法可以使渐变拉伸以填充窗口而不是重复？

429 css gradient

15

当CSS中存在填充时，如何使TextArea的宽度为100％而不会溢出？

我正在渲染以下CSS和HTML代码段。 textarea { border:1px solid #999999; width:100%; margin:5px 0; padding:3px; } <div style="display: block;" id="rulesformitem" class="formitem"> <label for="rules" id="ruleslabel">Rules:</label> <textarea cols="2" rows="10" id="rules"/> </div> 运行代码段隐藏结果展开摘要问题是文本区域最终比父区域宽8像素（边框2像素+填充6像素）。有没有办法继续使用边框和填充，但将的总大小限制textarea为父级的宽度？

426 html css stylesheet

8

如何在Flexbox中垂直对齐文本？

我想使用flexbox在a内垂直对齐某些内容，<li>但没有取得很大的成功。我已经在网上检查过，许多教程实际上都使用了包装器div，该包装器是align-items:center从父级的flex设置获取的，但是我想知道是否有可能切掉这个额外的元素？我选择在这种情况下使用flexbox，因为列表项的高度是动态的%。 * { padding: 0; margin: 0; } html, body { height: 100%; } ul { height: 100%; } li { display: flex; justify-content: center; align-self: center; background: silver; width: 100%; height: 20%; } <ul> <li>This is the text</li> </ul> 运行代码段隐藏结果展开摘要

424 html css flexbox

16

响应式图像对齐中心引导程序3

我使用Bootstrap 3进行目录编制。当在平板电脑上显示时，由于产品尺寸较小（500x500），浏览器中的宽度为767像素，因此产品图像看上去很难看。我想将图像放在屏幕中央，但是由于某些原因，我不能。谁将帮助解决问题？

423 html css image twitter-bootstrap alignment

13

HTML表格的宽度为100％，在tbody中具有垂直滚动

如何设置<table>100％的宽度并仅在<tbody>垂直滚动条中放置一定的高度？ table { width: 100%; display:block; } thead { display: inline-block; width: 100%; height: 20px; } tbody { height: 200px; display: inline-block; width: 100%; overflow: auto; } <table> <thead> <tr> <th>Head 1</th> <th>Head 2</th> <th>Head 3</th> <th>Head 4</th> <th>Head 5</th> </tr> </thead> <tbody> <tr> <td>Content 1</td> <td>Content 2</td> <td>Content 3</td> …

423 html css vertical-scrolling

14

为什么@ font-face在woff文件上引发404错误？

我在@font-face公司网站上使用，效果很好/看起来不错。除Firefox和Chrome以外，该.woff文件均会引发404错误。IE不会引发错误。我的字体位于根目录，但是我尝试使用css文件夹中的字体，甚至提供字体的整个URL。如果从我的css文件中删除那些字体，我不会得到404，所以我知道这不是语法错误。另外，我使用了fontsquirrels工具来创建@font-face字体和代码： @font-face { font-family: 'LaurenCBrownRegular'; src: url('/laurencb-webfont.eot'); src: local('☺'), url('/laurencb-webfont.woff') format('woff'), url('/laurencb-webfont.ttf') format('truetype'), url('/laurencb-webfont.svg#webfontaaFhOfws') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'FontinSansRegular'; src: url('/fontin_sans_r_45b-webfont.eot'); src: local('☺'), url('/fontin_sans_r_45b-webfont.woff') format('woff'), url('/fontin_sans_r_45b-webfont.ttf') format('truetype'), url('/fontin_sans_r_45b-webfont.svg#webfontKJHTwWCi') format('svg'); font-weight: normal; font-style: normal; }

422 css http-status-code-404 font-face woff

8

Z索引不适用于固定定位

我有一个div默认位置（即position:static）和div一个fixed位置。如果设置元素的z索引，似乎不可能使固定元素位于静态元素之后。 #over { width: 600px; z-index: 10; } #under { position: fixed; top: 5px; width: 420px; left: 20px; border: 1px solid; height: 10%; background: #fff; z-index: 1; } <!DOCTYPE html> <html> <body> <div id="over"> Hello Hello HelloHelloHelloHelloHello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello </div> <div …

422 css z-index

Questions tagged «css»