Em uma página web construída com HTML5 foi criado o seguinte...
Em uma página web construída com HTML5 foi criado o seguinte contêiner:
<div id="caixa"></div>
Para formatar esse contêiner em um bloco CSS3 incorporado, foi digitado o seguinte bloco:
#caixa {
background: #8AC007;
width: 200px;
height: 150px;
}
Para que este contêiner tenha todos os cantos arredondados em 25 pixels deve-se utilizar no bloco CSS3 a propriedade
Gabarito comentado
Confira o gabarito comentado por um dos nossos professores
Gabarito: Letra D - border-radius: 25px;
A questão aborda a personalização visual de um elemento <div> utilizando CSS3, mais especificamente a estilização dos cantos desse elemento para que fiquem arredondados. Para resolver essa questão com sucesso, é necessário conhecer as propriedades CSS que permitem o controle da aparência das bordas dos elementos HTML.
A propriedade border-radius é a correta para arredondar os cantos de um elemento. Ela pode receber um ou mais valores para definir o raio dos cantos do elemento. Quando um único valor é fornecido, como em border-radius: 25px;, esse valor é aplicado a todos os quatro cantos do elemento, tornando-os igualmente arredondados. Assim, o elemento representado pelo ID #caixa terá todos os seus cantos arredondados em 25 pixels, de acordo com o valor especificado.
As demais alternativas são incorretas porque não representam uma propriedade válida em CSS para arredondar bordas:
border-roundednão é uma propriedade CSS válida.border-styleé utilizada para definir o estilo da borda (como sólida, pontilhada, etc), mas não para arredondar cantos.border-radius: both 25px;é uma tentativa de misturar valores, mas não é uma sintaxe correta em CSS.border-style: radius 25px;novamente confunde propriedades de estilo de borda com a de raio de arredondamento, que não é válida.
Portanto, a alternativa correta é a Letra D, que utiliza a propriedade border-radius com um valor de 25 pixels para criar cantos arredondados no elemento com ID #caixa.
Clique para visualizar este gabarito
Visualize o gabarito desta questão clicando no botão abaixo
Comentários
Veja os comentários dos nossos alunos
Rounded Borders
The border-radius property is used to add rounded borders to an element:
Example
p {
border: 2px solid red;
border-radius: 5px;
}
Note: The border-radius property is not supported in IE8 and earlier versions.
fonte: https://www.w3schools.com/css/css_border.asp
Quem não tem acesso: - -> D
d-
<html>
<head>
<style>
#caixa {
background: #8AC007;
width: 200px;
height: 150px;
border-radius: 25px;
}
</style>
</head>
<body>
<div id="caixa"></div>
</body>
</html>
The border-radius property defines the radius of the element's corners.
Tip: This property allows you to add rounded corners to elements!
https://www.w3schools.com/cssref/css3_pr_border-radius.asp
Clique para visualizar este comentário
Visualize os comentários desta questão clicando no botão abaixo
Conheça nossos planos