遗憾的是,IE7中不支持CSS大纲,所以我坚持使用边框.但是为页面上的任何元素添加边框会占用空间并可能会移动页面.
如果我正在添加一个2px的边框,那么我设置一个-2px的边距,它的底座并不完美,因为列表项向左移动,而"margin:auto"真的与它有关.
你可以在这里看到例子:
http://paul.slowgeek.com/nodeSelector/tests/simple.html
http://paul.slowgeek.com/nodeSelector/tests/center1.html
例如,如果页面具有:
<div>
<p>Lorem Ipsum</p>
</div>
Run Code Online (Sandbox Code Playgroud)
然后我做了:
<div>
<p style="border: 5px solid red">Lorem Ipsum</p>
</div>
Run Code Online (Sandbox Code Playgroud)
页面现在将大10 px,p元素将缩进5像素.但如果我这样做:
<div>
<p style="outline: 5px solid red">Lorem Ipsum</p>
</div>
Run Code Online (Sandbox Code Playgroud)
在Firefox 3中,页面将是完全相同的高度,并且元素将处于相同的位置.我希望这种行为跨浏览器工作.
基本上,如何使用CSS边框来获得CSS大纲的效果?
我以前用输入完成了这个,为什么这个不起作用?
http://euroworker.no/user/checkout
input.text, select, file, form.other
{
width: 15em;
font-size: 16px;
padding: 2px;
border-width:1px;
border-color:#dddddd;
border-style:inset;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
outline:none;
}
Run Code Online (Sandbox Code Playgroud)
只想要一种颜色,#dddddd.
我正在用HTML创建一个表,并尝试为单元格分配边框.这是它的出现方式.

在第2行,最后一个单元格中看到奇怪的边框.这就是我遇到的问题.
<table class="info">
<tbody>
<tr>
<td>Some text</td>
<td>Some text</td>
<td>Some text</td>
<td>Some text</td>
</tr>
<tr>
<td><span>0</span></td>
<td><span>0</span></td>
<td><span>0</span></td>
<td><span>0</span></td>
</tr>
<tr>
<td>Some text</td>
<td>Some text</td>
<td>Some text</td>
<td>Some text</td>
</tr>
<tr>
<td><span>0</span></td>
<td><span>0</span></td>
<td><span>0</span></td>
<td><span>0</span></td>
</tr>
<tr>
<td>Some text</td>
<td>Some text</td>
</tr>
<tr>
<td><span>0</span></td>
<td><span>0</span></td>
</tr>
</tbody>
</table>
Run Code Online (Sandbox Code Playgroud)
这是我的CSS ....
table.info {
width: 100%;
text-align: center;
}
table.info td {
background: #fff;
border: 2px solid #ccc;
text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
我在这里做错了什么?
更新 - 我检查了继承的css,我发现了这个......
table {
border-collapse:collapse;
border-spacing:0;
}
Run Code Online (Sandbox Code Playgroud) 我有一个报告,我在Report Builder 3.0中创建,我似乎无法在TextBoxes Borders上设置颜色值(或任何值).
我有一个列表,我已添加一个文本框.然后我单击文本框并选择文本框属性...然后单击边框,颜色的值为:黑色.如果我将此值更改为其他任何值,然后单击"确定",然后返回"文本框"属性,将其设置回"黑色".知道这里发生了什么吗?这不是设置边框颜色的正确方法吗?
标题几乎说明了我要做的事情,但为了详细说明,我想将一些CSS应用于一个prochart-colitem没有启用javascript的用户调用的类.
原因?我使用百分比的列宽等于100%,然后使用javascript从每个div中减去2个像素,同时添加一个边框.
如果没有启用javascript,列+边框等于父div的100%以上,我需要从类中减去几个像素,使其适合父div到no-js用户.
有什么简单的方法吗?我<noscript>在<style>里面尝试过,没有运气.
如何为此编码?

当我们有这个:

如
<html>
<head>
<style>
h2
{
letter-spacing:4pt;
font-size:40pt;
color:blue;
text-align:center;
position:absolute;
top:0px;
}
h3
{
letter-spacing:4pt;
font-size:40pt;
color:blue;
text-align:center;
position: absolute;
top:20px;
left:20px;
}
</style>
</head>
<body>
<h2>All right, Mate?</h2>
<h3>All right, Mate?</h3>
</body>
</html>
</html>
Run Code Online (Sandbox Code Playgroud)
...而不更改原始功能/标签.
只添加(或修改)一点.
我想在这个页面上实现类似于Tim Cook图像周围的CSS边框:http://www.macstories.net/news/tim-cook-at-d11/ - 但是,我只想要我自己网站上正文中的图像边框,而不是我站点边栏中的图像.
我需要什么代码来实现很酷的边框,我如何只定位正文中的图像?
我有用three.js创建的多边形/多面体吗?可以设置边框的宽度和颜色吗?这是我的示例代码,您可能会在其中看到一个图。如何设置边界?可能还有其他创建多边形的方法吗?
<html>
<head>
<title>???</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="../build/three.min.js"></script>
<script src="http://stemkoski.github.io/Three.js/js/OrbitControls.js"></script>
<script>
var phi = 0;
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 3000 );
//var camera = new THREE.OrthographicCamera( window.innerWidth / - 200, window.innerWidth / 200, window.innerHeight / 200, window.innerHeight / - 200, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight …Run Code Online (Sandbox Code Playgroud)我正在尝试创建某种具有活动和非活动元素的选择器菜单,并且根据选择哪一个,它会显示一个或另一个.
我为菜单和内容设置了边框,但是当我选择不同的菜单选项时,我想通过删除底部边框使其"连接".它看起来很好,因为我决定为此设置一个透明的背景颜色:rgba(150,150,150,0.5).父项的边框是可见的,因为所选菜单子项的背景不是实心的.
简化的html:
<div class="menu-alias fac">
<div id="menu_fac_1" class="alias afac aliselected">
<a style="cursor:pointer" onclick="facalias(1);" class="alias-fac-a">D</a>
</div>
<div id="menu_fac_0" class="alias afac ali-nuevo">
<a style="cursor:pointer" onclick="facalias(0);" class="alias-fac-a">+</a>
</div>
</div>
<div class="facturacion" id="fac_1" style="display: block;">
<label for="acc_f_nombre_1" class="acc-label required">
Nombre:<span class="required">*</span><input id="acc_f_nombre_1" value="D" type="text" class="acc-text upp">
</label>
</div>
<div class="facturacion" id="fac_0" style="display: none;">
<label for="acc_f_nombre_0" class="acc-label required">
Nombre:<span class="required">*</span><input id="acc_f_nombre_0" value="" type="text" class="acc-text upp">
</label>
</div>
Run Code Online (Sandbox Code Playgroud)
和css:
.menu-alias {
float: left;
width: 100%;
border-bottom: 1px solid;
display: flex;
}
.menu-alias .alias.aliselected {
background-color: …Run Code Online (Sandbox Code Playgroud) 我想用html和css创建一个粘滞便笺.我的代码是这样的:
.div{
margin:50px;
position:relative;
}
.box {
background: #ff1;
height: 178px;
width: 409px;
margin: 25px;
/*padding: 20px;*/
position: relative;
overflow: hidden;
border-left: 0px;
border-top-left-radius:70px;
border-bottom-right-radius:30px
}
.box:before {
content: "";
display: block;
background: #fff;
position: absolute;
top: -38px;
left: -268px;
width: 310px;
height: 248px;
border-bottom-right-radius: 70px;
padding:0px;
}Run Code Online (Sandbox Code Playgroud)
<div class="div">
<div class="box"></div>
</div>Run Code Online (Sandbox Code Playgroud)
我的问题是右键这是相当曲线.但我会略微倾斜.就像你在图像中看到的一样.有人可以帮帮我吗?谢谢.
border ×10
css ×7
html ×5
javascript ×2
column-width ×1
html-table ×1
input ×1
outline ×1
position ×1
rgba ×1
styles ×1
textbox ×1
three.js ×1