стили кнопок HTML

Question

Как вы можете добавить несколько стилей к одной кнопке ... это не работает.

<button style="background:red", "cursor:pointer">click me</button>

Я пробовал:

• style="background:red", "cursor:pointer"
• style="background:red" "cursor:pointer"
• style="background:red" style="cursor:pointer"

Возможно ли объединить несколько стилей?

Answer 1

Вы действительно должны использовать класс CSS и избегать стилизации встроенных узлов DOM:

<style type="text/css">
    .btn {
        background-color:red;
        cursor:pointer;
    }
</style>

<button class="btn">Click me</button>

Еще лучше, если бы вы создали файл CSS.

CSS (style.css):

.btn {
    background-color:red;
    cursor:pointer;
}

HTML:

   <link rel="stylesheet" href="style.css" />
   <button class="btn">Click me</button>

Answer 2

Разделите свойства с помощью ; и поместите все свойства в один и тот же набор кавычек:

<button style="background:red; cursor:pointer">click me</button>

http://jsfiddle.net/userdude/GcY97/

То же самое относится и к объявлениям класса CSS:

button {
    background: red;
    cursor: pointer;
}

Answer 3

Вы разделяете все свойства стиля html точкой с запятой - ;

style="background: red; cursor: pointer;"