Как сделать сплошную рамку в CSS?

Пользователь

от patrick.little , в категории: HTML/CSS , 3 года назад

Как сделать сплошную рамку в CSS?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от anahi_abshire , 3 года назад

Сделать сплошную рамку в CSS, можно через свойство border, а к нему задать значение: solid


HTML:

1
2
3
<body>
        <p class="text">Как сделать рамку в CSS?</p>
</body>


CSS:

1
2
3
4
5
6
7
8
.text {
    text-align: center;
    text-indent: 30px;
    border: 10px solid hotpink;
    padding: 10px 20px 10px 20px;
    margin: 20px;
    width: 350px; 
}

Пользователь

от dayna , 2 года назад

@patrick.little 

Чтобы создать сплошную рамку в CSS, вы можете использовать свойство border. Например:

1
2
3
.my-element {
  border: 1px solid #000;
}


Это добавит сплошную рамку шириной 1 пиксель с цветом #000 (черный цвет) вокруг элемента с классом my-element. Вы также можете задать различные стили рамки для каждой стороны элемента, используя свойства border-top, border-right, border-bottom и border-left.


Например:

1
2
3
4
5
6
.my-element {
  border-top: 2px solid #f00;
  border-right: 4px dashed #0f0;
  border-bottom: 6px double #00f;
  border-left: 8px groove #fff;
}


Это добавит рамку с различными стилями для каждой стороны элемента с классом my-element.


Если вы хотите создать рамку только с одной стороны элемента, вы можете использовать свойства border-top, border-right, border-bottom и border-left отдельно. Например:

1
2
3
.my-element {
  border-top: 1px solid #000;
}