Question

如何在Html中编码长度为50且宽度为50的蓝色按钮？

我真的很陌生

我已经有一个按钮，但我不知道如何更改它的颜色和大小

<button type="button">Click Me!</button>

Answer 1

有几种方式来设置元素样式，它们都使用CSS。最常见的是包含具有所有所需样式的CSS文件，但是为了这个示例，您可以在HTML中包含样式标记。

<style>
  button {
    display: block;
    width: 50px;
    height: 50px;
    background-color: blue;
  }
</style>

请注意，我还制作了元素block的显示类型，以便我能够操纵它的宽度和高度。

Answer 2

<input type="button" style="background-color:blue;width:1330px;" value="click Me">

Answer 3

为了总结一下事情，您可以遵循3种可能性：

<强> 1。为按钮使用内联样式：

<button type="button" style="display: block; width: 50px;height: 50px; background-color:blue;">Click Me!</button>

<强> 2。使用<style>标记设置按钮的样式：

<style>
   button {
     display: block;
     width: 50px;
     height: 50px;
     background-color:blue;
   }
</style>

第3。将您的样式放在外部CSS文件中并将其包含在您的HTML的<head>。

<link href="path/to/your/file.css" rel="stylesheet" type="text/css" />

注意：

选择使用哪种方法取决于具体情况，对于简单的情况，您可以使用内联样式。

这是一个简单的代码段：

<button type="button" style="display: block; width: 50px;height: 50px; background-color:blue;">Click Me!</button>

Answer 4

一个非常快速的解决方案是像这样添加内联样式：

<button type="button" style="display: block; width: 50px; height: 50px;">Click Me!</button>

蓝色按钮HTML CSS更改大小

4 个答案: