Question

以下是代码：

<head>
      <meta http-equiv="refresh" content="01">
    <title>
        Slot Data
    </title>
</head>          
<body> 
    <style>
    div
    {
        height: 100px;
        width: 50px;
        background-color: green;
    }
   </style>
<div></div>
   <style>
   div
    {
        height: 100px;
        width: 50px;
        background-color: green;
    }
   </style>
<div></div>

</body>

它们恰好是一个在另一个之下。

另外，我需要一种方法来改变颜色＆＃34;绿色＆＃34; to＆＃34; red＆＃34;对于用python编写的条件。为此，该片段为：

if count1 >= 0.65 * 122*85:
                print "car0 absent"
                cv2.rectangle(dst1,(8,8),(340,488),(0,255,0),2) #green
                cv2.putText(dst1,'slot empty',(12,450), font, 1,(255,255,255),1,cv2.LINE_AA)
                f = open('test.html','r')
                filedata = f.read()
                f.close()
                newdata = filedata.replace("red","green")
                f = open('test.html','w')
                f.write(newdata)
                f.close()


            else:
                print "car0 present"
                cv2.rectangle(dst1,(8,8),(340,488),(0,0,255),2) #red
                cv2.putText(dst1,'slot occupied',(12,450), font, 1,(255,255,255),1,cv2.LINE_AA)
                f = open('test.html','r')
                filedata = f.read()
                f.close()
                newdata = filedata.replace("green","red")
                f = open('test.html','w')
                f.write(newdata)
                f.close()

我和另一个car1有相同的代码。我如何以不同方式处理两个矩形？替换机制将替换我不想要的CSS矩形的颜色。

感谢任何帮助。

Answer 1

<div>通常显示为block level elements，但可以display: inline-block显示在彼此旁边。

你似乎对CSS / HTML很陌生，可能会做一些研究或教程以更加牢固地掌握事物 - 一开始CSS可能很奇怪，但随着你越来越熟悉它会变得更容易。 / p>

就个人而言，我会使用类来适当地定位元素。至于在Python中按类获取元素，我并不是很确定 - 我不能说我完全了解你是如何用Python操纵这些东西的 - 这是显示/在浏览器中执行？

我在下面创建了一个代码片段。

＆＃13;

.rect {
    height: 100px;
    width: 50px;
    display: inline-block;
    background-color: green;
}
.alert {
    background-color: red;
}

＆＃13;

<head>
      <!--<meta http-equiv="refresh" content="01">-->
    <title>
        Slot Data
    </title>
</head>          
<body> 
  <div class="rect"></div>

  <div class="rect alert"></div>

</body>

＆＃13;

请注意，还有其他方法可以做到这一点 - CSS提供各种定位/布局工具。祝你好运！

Answer 2

您可以使用 float：left 使它们显示在彼此旁边。

e.latlng.lat.toFixed(6);

如果你想要第二行，请记得清除它。只需使用样式

创建一个小元素

float:left

这是一个方便的小提琴，真正帮助了解 css 的工作方式：

https://jsfiddle.net/nfnneil/6jgsp9dx/

如何并排放置2个CSS矩形？默认情况下，它们显示在另一个之下

2 个答案: