Em primeiro lugar, quero afirmar que não sou contra a grelha na concepção, sou contra a grelha na reconstrução. Isso deve se referir especificamente ao método YUI de grade de ligação de nome de classe. Você pode dar uma olhada no seguinte trecho de código:
Exemplo de código-fonte
[www.downcodes.com] <div id="yui-main">
<div class="yui-b">
<div class="yui-g">
<div class="yui-u primeiro"></div>
<div class="yui-u"></div>
</div>
</div>
</div>
Você pode ver claramente que o nome yui-u ou yui-g aqui não tem sentido. Há também novidades relacionadas ao desempenho. Não sei se existe uma frase no PPT que acompanha o livro "Reconstrução de Site" que todo mundo leu - "Depois de remover as tags de aparência da página, redesenhar o site e o conteúdo existentes economizará muito trabalho (No ao mesmo tempo, é muito mais barato). Se você quiser alterar a saída do site, basta alterar a folha de estilo sem alterar a própria página "O código como o acima não consegue a separação de estrutura, desempenho, e comportamento. As alterações causarão os seguintes problemas:
Ao alterar o desempenho, o HTML deve ser movido. Uma bela modificação requer a movimentação de três linhas de trabalho, o que consome muitos recursos humanos.
A quinta caixa chamada “primeiro” aparecerá.
Uma caixa chamada "180 de largura", que na verdade tem 240 de largura, aparecerá.
Haverá um layout chamado "quatro colunas", que na verdade tem três colunas.
Haverá uma palavra chamada “azul” que na verdade é vermelha.
Eles são equivalentes a "caixa_esquerda" e "caixa_direita" que são populares entre muitas pessoas agora. Após uma rápida revisão, eles se tornaram a "caixa_direita" à esquerda. Isso não equivale a distorcer a verdade? Mas na verdade o mais importante é o primeiro ponto. Essa forma de trabalhar é diferente da nossa forma anterior de trabalhar com layout de tabela? Se você solicitar uma mudança de estilo, toda a empresa (design, página, desenvolvimento, testes funcionais, monitoramento de dados CE) irá segui-lo.
Depois de escrever isso, olhei para trás e mudei o título para se tornar o segundo artigo sobre CSS da série “This Will Be a Revolution”. Se o acima estiver incorreto, deixe-me mostrar um trecho de código de uma nova versão de um projeto que assumi recentemente:
Exemplo de código-fonte
[www.downcodes.com] <div id="index_news" class="mode">
<h3 class="title">Notícias sobre bem-estar público</h3>
<div class="conteúdo">
<ul>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
<li><a href="#">Título da notícia, título da notícia, título da notícia, título da notícia</a></li>
</ul>
</div>
<a class="more" href="#">Mais</a> </div>
Exemplo de código-fonte
[www.downcodes.com] .modo{
posição:relativo;
flutuar:esquerda;
tamanho da fonte: 12px;
}
.modo h3.título,
.mode h4.title{
cor:#234C00;
preenchimento: 5px 10px;
tamanho da fonte: 14px;
}
.modo .mais{
topo:5px;
direita: 10px;
tamanho da fonte: 12px;
cor:#4282ab;
posição:absoluta;
}
.modo .content{
claro: ambos;
}
.mode .content:depois {
contente:"";
exibição: bloco;
altura:0;
altura da linha:0;
claro: ambos;
visibilidade:oculto;
}
#index_news.mode,
#index_bbs.mode,
#index_area.mode{
background:url(small_gray_grid.png) repetir-y -400px inferior;
largura:200px;
margem:5px 0 5px 5px;
}
#index_news.mode h3.title,
#index_bbs.mode h3.title{
background:url(small_gray_grid.png) sem repetição -200px no topo;
}
#index_news.mode .content,
#index_bbs.mode .content,
#index_area.mode.content{
background:url(small_gray_grid.png) sem repetição -600px inferior;
exibição: mesa;
}
Você pode ver as vantagens do pensamento modular:
Os módulos existentes podem ser usados de forma semiautomática para economizar tempo e esforço de desenvolvimento de código.
Ele pode ser adaptado com muita liberdade às diferentes necessidades anormais de qualquer gerente de produto e de qualquer chefe.
Quaisquer alterações no desempenho acima não exigem o envolvimento dos desenvolvedores e nenhum teste funcional é necessário.
O monitoramento de dados CE está vinculado ao ID e não há necessidade de reajustar a interface.
Cada pessoa é responsável pelo rápido desenvolvimento iterativo de um único módulo.
Também no que diz respeito ao código. O título é o título, e o conteúdo é o conteúdo; você nunca distorcerá os fatos e dará um tapa na boca.
Eu tenho uma peculiaridade. Adoro que durante as entrevistas eu sempre teste primeiro o XHTML do entrevistador. Assim como quando um mestre recrutou um aprendiz no passado, a habilidade e a inteligência eram secundárias, e o caráter era a primeira prioridade.
Acredito que XHTML é como a essência de uma pessoa, CSS é como o jeito e a atitude de uma pessoa de fazer as coisas, e JS é como o comportamento e o estilo de uma pessoa de fazer as coisas. A separação dos três mais alguns aspectos relacionados ao SEO e à interação humano-computador é o que chamamos de reconstrução de site, que é uma pessoa muito boa. No passado, algumas pessoas sempre pensaram que o CSS era o elemento mais importante do site. Na verdade, representa naturalmente uma visão da vida. Na verdade, é difícil para uma pessoa sobreviver na sociedade de hoje sem uma boa maneira e atitude de fazer as coisas, mas se a maneira e a atitude de fazer as coisas forem muito focadas, ela se tornará uma pessoa boa em enganar e que faz as coisas sem escrúpulos; .
Isso é o que sempre quis dizer. Com CSS, você pode alterar a ordem esquerda-direita para direita-esquerda. É um mágico na página da web. Você não pode abusar dele para se tornar uma pessoa boa em enganar e que faz coisas sem escrúpulos.