atributo style width vs width em HTML

vi a última publicação semelhante à minha pergunta altura do estilo de tela HTML5 vs altura do atributo
Mas nesse post, não havia nenhuma informação clara sobre qual trabalhará e qual é a diferença?

tentei o seguinte exemplo:

<html>
    <head>
    </head>
      <body>
        <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
        <script src="jquery-1.11.1.js"></script>
        <script src="https://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
        <script src="script.js"></script>

        <div>
             <select style="width: 200px" width="200px">
                   <option value="Test1"> Test1 </option>
                   <option value="Test2"> Test2 </option>
                   <option value="Test3"> Test3</option>
                   <option value="Test4"> Test4 </option>
                   <option value="Test5"> Test5 </option>
             </select>
        </div>
     </body>
 </html>        

mas no exemplo acima, se colocar tanto Estilo= "Largura: 200px" ou Largura= "200px" , o mesmo resultado não é visto.

Pergunta:
1) Por que style = "width: 200px and width=" 200px not giving same result?
2) Qual é a diferença entre Largura= "200px" ou Largura="200"?

Alguns podem ajudar-me a limpar o básico?

Author: Community, 2014-10-15

3 answers

O atributo width é inválido num select elemento. O que importa mais, Esta restrição é imposta pelos navegadores: eles ignoram o atributo. (Há muito tempo atrás, o Netscape 4 o apoiou, e foi descrito no Draft HTML 3.0, que expirou em 1995. Algum código legado, talvez até práticas de codificação legadas, Pode ainda refletir tais coisas!)

Então a resposta é simples: eles diferem de modo que o atributo width no HTML não tem efeito (então o elemento toma o seu padrão width), whereas the width property in CSS works in the normal CSS way.

O atributo width não é um atributo geral no HTML: é permitido para um determinado conjunto de elementos e definido individualmente para eles.

 2
Author: Jukka K. Korpela, 2014-10-15 07:00:51

Para a maioria dos elementos html, width atributo não tem nada a ver com a largura do elemento. O que define o estilo de um elemento(certamente contém width) é o atributo do elemento style.

Por outras palavras, o style.width(style="width: 200px;") o atributo determina a largura do elemento. Mas alguns elementos como canvas, svg, o atributo width irá determinar a largura do elemento, se não definir o atributo style.width. Neste caso, width="200px" é o mesmo que width="200" porque a maioria dos navegadores usa o px como unidade padrão.

PS:

  • o width é inválido para definir a largura do select.
  • mas o atributo width é válido. Você pode acessá-lo e mudá-lo com liberdade. Podes usá-lo para fazer outras coisas.
 1
Author: creeper, 2014-10-15 09:12:23

1) <select style="width: 200px"> style aqui está o atributo do elemento <select> HTML, o que está escrito dentro da citação é código CSS . Igualmente., <select width="200px"> width aqui está o atributo de <select>. No entanto,<select> tag não tem width atributo ver aqui (em attributes) Mais informações HTML attributes: aqui

Ver DEMO

2) width="200" é equivalente a width="200px"

 -1
Author: Edwin, 2014-10-15 05:43:26