我的html文档的主体由3个元素组成,一个按钮,一个表单和一个画布.我希望按钮和窗体右对齐,画布保持左对齐.问题是,当我尝试对齐前两个元素时,它们不再相互跟随而是水平相邻？继承了我到目前为止的代码,我希望表单在右边的按钮之后直接跟随两者之间没有空间.
#cTask {
background-color: lightgreen;
}
#button {
position: relative;
float: right;
}
#addEventForm {
position: relative;
float: right;
border: 2px solid #003B62;
font-family: verdana;
background-color: #B5CFE0;
padding-left: 10px;
}<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="timeline.js"></script>
<link rel="stylesheet" href="master.css" type="text/css" media="screen" />
</head>
<body bgcolor="000" TEXT="FFFFFF">
<div id="button">
<button onclick="showForm()" type="button" id="cTask">
Create Task
</button>
</div>
<div id="addEventForm">
<form>
<p><label>Customer name: <input></label></p>
<p><label>Telephone: <input type=tel></label></p>
<p><label>E-mail address: <input type=email></label></p>
</form>
</div>
<div>
<canvas id="myBoard" width="1000" …这就是问题.我有一个div,其中包含几段文字,然后是一个浮动的图像.图像按原样浮动,但包含的div不会垂直扩展以适应图像.我知道我可以手动设置div的高度,但这会产生问题,因为我想对我的网站的每个页面使用相同的div,因此高度需要不同.
这是一个代码示例:
#main_contentbox {
width: 918px;
margin: 10px auto;
padding: 10px 20px 20px 20px;
background-color: #ffffff;
border-style: solid;
border-width: 1px;
border-color: #000;
}
#main_contentbox img#sample {
float: right;
}<div id="main_contentbox">
<h1 class="page"> The Event </h1>
<img id="sample" src="sample.jpg" />
<p>
stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!</p>
<p>stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!stackoverflow is awesome!
</div>表头是固定的,但在滚动后它位于页面的顶部.它完全按照我的要求工作,除了thead被固定在错误的地方.
该表有一个overflow-x:auto,而TD正在使用white-space:nowrap,因此表扩展以处理内容.
我需要它从页眉的顶部或右下方固定140像素.我无法弄清楚如何抵消这个......它很接近,但需要考虑溢出......
这是JSFIDDLE - https://jsfiddle.net/rbla/1Ljuycbe/1/
请查看FIRST表...问题在于OVERFLOW-X:AUTO - 我需要克隆表来反映这一点......
JQUERY
;(function($) {
$.fn.fixMe = function() {
return this.each(function() {
var $this = $(this),
$t_fixed;
function init() {
$this.wrap('<div class="container" />');
$t_fixed = $this.clone();
$t_fixed.find("tbody").remove().end().addClass("fixed").insertBefore($this);
resizeFixed();
}
function resizeFixed() {
$t_fixed.find("th").each(function(index) {
$(this).css("width",$this.find("th").eq(index).outerWidth()+"px");
});
}
function scrollFixed() {
var offset = $(this).scrollTop(),
tableOffsetTop = $this.offset().top,
tableOffsetBottom = tableOffsetTop + $this.height() - $this.find("thead").height();
if(offset < tableOffsetTop || offset > tableOffsetBottom)
$t_fixed.hide();
else if(offset >= tableOffsetTop && offset <= tableOffsetBottom && $t_fixed.is(":hidden"))
$t_fixed.show(); …我正在尝试[[:>:]]在我的正则表达式中使用,但是在其他角色类例如[[:digit:]]或者[[:word:]]是.出了什么问题？
这是我在StackOverflow中的第一个问题,因为这是我第一次找不到帮助我解决问题的答案.
我正在尝试为带有引导程序的菜单创建一个表.我希望早餐,午餐和晚餐的每列宽度为30%,而且要说碳水化合物,脂肪和蛋白质10%,但我不能让它起作用.
我阅读了文档,实际上在这里发现了一个非常相似的静态.但是,我仍然无法使其发挥作用.我把我的代码放在CodePen中,这样你就可以看到我所看到的.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<table class="table table-bordered">
<thead>
<tr class="m-0">
<th class="w-10">#</th>
<th class="w-30">Breakfast</th>
<th class="w-30">Lunch</th>
<th class="w-30">Dinner</th>
</tr>
</thead>
<tbody>
<tr class="m-0">
<th scope="row" class="w-10">Carbohydrates</th>
<td class="w-30">-
</td>
<td class="w-30">
-
</td>
<td class="w-30">-
</td>
</tr>
<tr class="m-0">
<th scope="row" class="w-10">Fat</th>
<td class="w-30">-
</td>
<td class="w-30">
-
</td>
<td class="w-30">-
</td>
</tr>
<tr class="m-0">
<th scope="row" class="w-10">Proteins</th>
<td class="w-30">-
</td>
<td class="w-30">
-
</td>
<td class="w-30">-
</td>
</tr>
</tbody> …我有通过TCP传递给我的字符串内容.此信息仅相关,因为这意味着我不会一直检索相同的字符串.我有一个<start>和<stop>分隔符,以确保任何时候我通过TCP获取数据,我输出完整的内容.
我传入的内容如下:
<start>Apple Bandana Cadillac<stop>
我想在这两者之间得到的一切<start>和<stop>.所以只是Apple Bandana Cadillac.
我这样做的脚本如下:
servercsv.on("connection", function(socket){
let d_basic = "";
socket.on('data', function(data){
d_basic += data.toString();
let d_csvindex = d_basic.indexOf('<stop>');
while (d_csvindex > -1){
try {
let strang = d_basic.substring(0, d_csvindex);
let dyson = strang.replace(/<start>/g, '');
let dson = papaparse.parse(dyson);
myfunction(dson);
}
catch(e){ console.log(e); }
d_basic = d_basic.substring(d_csvindex+1);
d_csvindex = d_basic.indexOf('<stop>');
}
});
});
这意味着我在<stop>字符串之前获取所有内容并输出它.我还包括该行,let dyson = strang.replace(/<start>/g, '');因为我想删除<start>文本.
但是,因为这是TCP,我无法保证获得此字符串的所有部分.结果,我经常回来 …
我试图改变颜色只有第三个但由于某种原因css nth-of-type不起作用......
ul li a:nth-of-type(3){
color: #111111;
} <ul>
<li class="nav_menu"><a id="currentlink" href="#">HOME PAGE</a></li>
<li class="nav_menu"><a href="homework/homework2/index.html">II</a></li>
<li class="nav_menu"><a href="#">III</a></li>
<li class="nav_menu"><a href="#">IV</a></li>
<li class="nav_menu"><a href="#">V</a></li>
<li class="nav_menu"><a href="#">VI</a></li>
<li class="nav_menu"><a href="#">VII</a></li>
<li class="nav_menu"><a href="#">VIII</a></li>
<li class="nav_menu"><a href="#">IX</a></li>
<li class="nav_menu"><a href="#">X</a></li>
</ul>我该如何解决？谢谢您的帮助.