├── img ├── cidade.jpg ├── doutor.jpg ├── fundo.png ├── logo.png ├── mundo.jpg ├── taxi.jpg ├── divisor.png ├── marcador.png ├── fundo-caixa.png ├── tecnologia.jpg └── detalhe-topo.png ├── internacional.html ├── nova-legislacao.html ├── fotos.html ├── brasil.html ├── css └── style.css └── index.html /img/cidade.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/cidade.jpg -------------------------------------------------------------------------------- /img/doutor.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/doutor.jpg -------------------------------------------------------------------------------- /img/fundo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/fundo.png -------------------------------------------------------------------------------- /img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/logo.png -------------------------------------------------------------------------------- /img/mundo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/mundo.jpg -------------------------------------------------------------------------------- /img/taxi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/taxi.jpg -------------------------------------------------------------------------------- /img/divisor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/divisor.png -------------------------------------------------------------------------------- /img/marcador.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/marcador.png -------------------------------------------------------------------------------- /img/fundo-caixa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/fundo-caixa.png -------------------------------------------------------------------------------- /img/tecnologia.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/tecnologia.jpg -------------------------------------------------------------------------------- /img/detalhe-topo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/noticias-cidade/master/img/detalhe-topo.png -------------------------------------------------------------------------------- /internacional.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Notícias Cidade - Seu site de notícias 5 | 6 | 7 | 8 | 9 | 10 |
11 |
12 |

Notícias cidade

13 | 34 |
35 |
36 | 37 | 38 | -------------------------------------------------------------------------------- /nova-legislacao.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Notícias Cidade - Seu site de notícias 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 |
17 |

Notícias cidade

18 | 39 |
40 | 41 | 42 |
43 | 44 | 45 |
46 | 47 |
48 |

Destaque

49 |
50 |

Nova Legislação

51 | 52 |

53 | Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. 54 |

55 |
56 |
57 |
58 | 59 | 60 |
61 | 62 | 63 |
64 | 65 | 66 | 67 | 68 |
69 |
70 | © Copyright 2000 - 2019 Notícias Cidade 71 |
72 |
73 | 74 | 75 | 76 | 77 | -------------------------------------------------------------------------------- /fotos.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Notícias Cidade - Seu site de notícias 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 |
17 |

Notícias cidade

18 | 39 |
40 | 41 | 42 |
43 | 44 | 45 | 109 | 110 | 111 |
112 | 113 | 114 |
115 | 116 | 117 | 118 | 119 |
120 |
121 | © Copyright 2000 - 2019 Notícias Cidade 122 |
123 |
124 | 125 | 126 | 127 | 128 | -------------------------------------------------------------------------------- /brasil.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Notícias Cidade - Seu site de notícias 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 |
17 |

Notícias cidade

18 | 39 |
40 | 41 | 42 |
43 | 44 | 45 | 109 | 110 | 111 | 112 | 113 |
114 | 115 |
116 |

Entrevistas

117 |
118 | 128 |
129 |
130 | 131 |
132 |

News

133 |
134 | 135 |
136 | 137 |
138 | 139 | 140 |
141 | 142 |
143 | 144 |
145 |
146 | 147 |
148 |
149 | 150 |
151 | 152 | 153 |
154 | 155 | 156 |
157 | 158 | 159 | 160 | 161 |
162 |
163 | © Copyright 2000 - 2019 Notícias Cidade 164 |
165 |
166 | 167 | 168 | 169 | 170 | -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | /*Estrutura do site*/ 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | } 7 | 8 | body { 9 | font-family: "Trebuchet MS", Helvetica, sans-serif; 10 | background: #fff url(../img/fundo.png) repeat-x; 11 | } 12 | 13 | #container { 14 | width: 760px; /* Antes era 720px. Tive que fazer a alteração dessa largura, pois o detalhe estava perto demais do menu.*/ 15 | margin: 0 auto; 16 | } 17 | 18 | #topo { 19 | height: 150px; 20 | background: url(../img/detalhe-topo.png) no-repeat right top; 21 | padding-top: 25px; 22 | } 23 | 24 | .logo { 25 | width: 152px; 26 | height: 66px; 27 | background: url(../img/logo.png) no-repeat center; 28 | text-indent: -10000px; 29 | } 30 | /*Barra de navegação*/ 31 | 32 | a:link, a:visited { 33 | color: #b10333; 34 | padding: 2px; 35 | } 36 | 37 | a:hover { 38 | color: #e50040; 39 | } 40 | 41 | ul { 42 | margin: 0; 43 | padding: 0; 44 | list-style: none; 45 | } 46 | 47 | #topo ul { 48 | margin-top: 30px; 49 | background: #b10333; 50 | float: left; 51 | } 52 | 53 | #topo ul li { 54 | float: left; 55 | } 56 | 57 | #topo ul a { 58 | font-size: 0.9em; 59 | display: block; 60 | padding: 0.5em 1.5em; 61 | line-height: 2.1em; 62 | text-decoration: none; 63 | color: #fff; 64 | background: url(../img/divisor.png) no-repeat left center; 65 | } 66 | 67 | #topo ul .primeiro a { 68 | background: none; 69 | } 70 | 71 | #topo ul a:hover { 72 | color: #69001d; 73 | } 74 | 75 | body.home #navegacao a#home, 76 | body.brasil #navegacao a#brasil, 77 | body.internacional #navegacao a#internacional, 78 | body.fotos #navegacao a#fotos { 79 | color: #fff; 80 | background: #de003e; 81 | cursor: text; 82 | } 83 | 84 | /*Configura layout de 3 colunas*/ 85 | #conteudo { 86 | margin-top: 60px; 87 | background: #f5f5f5; 88 | } 89 | 90 | #uma-coluna #primario { 91 | width: 760px; 92 | float: left; 93 | margin: 0 0 20px 0px; 94 | } 95 | 96 | #duas-colunas #primario { 97 | width: 560px; /* Chegou a esta conclusão, pois somou as duas colunas e acrescentou a metade do espaçamento (270*2 + 20) */ 98 | float: left; 99 | margin: 0 0 20px 200px; 100 | } 101 | 102 | 103 | 104 | #lateral { 105 | width: 180px; 106 | float: left; 107 | margin: 0 0 20px -760px; 108 | } 109 | 110 | #primario { 111 | width: 270px; 112 | float: left; 113 | margin: 0 0 20px 200px; /* O que aconteceu aqui: para que a lateral fique no lado esquerdo foi necessário utilizar a tag margin para direcionar os elementos flutuantes. No lado esquerdo ficou 200px porque somou 180px (que é o lado da lateral) com a metade (20) do total (40) da largura do container, ou seja, 180px + 20px. */ 114 | /*Para fazer o calculo de cada largura do conteudo foi necessário somar as duas colunas que terão a mesma largura (270), com o total somou com 180 e depois diminuiu com o total da largura do container (760px). Nisso, o que sobrou foi o total do espaçamento que poderá ter para distanciar as colunas uma das outras. */ 115 | } 116 | 117 | 118 | #secundario { 119 | width: 270px; 120 | float: left; 121 | margin: 0 0 20px 20px; 122 | } 123 | 124 | /*Caixa*/ 125 | 126 | .caixa { 127 | margin: 10px 0; 128 | padding: 5px 0 5px 0; 129 | background: #f3f3f3 url(../img/fundo-caixa.png); 130 | } 131 | 132 | h2 { 133 | font-size: 1.1em; 134 | background: #294c71; 135 | color: #fff; 136 | padding: 5px; 137 | } 138 | 139 | .caixa-conteudo { 140 | background: #fff; 141 | padding: 5px; 142 | margin-top: 5px; 143 | } 144 | 145 | /*Formatar menus laterais*/ 146 | 147 | #lateral ul a { 148 | font-size: 0.9em; 149 | padding: 3px; 150 | display: block; 151 | line-height: 30px; 152 | color: #000; 153 | text-decoration: none; 154 | border-bottom: 1px solid #f3f3f3; 155 | } 156 | 157 | #lateral ul a:hover { 158 | background: #f9f9f9 url(../img/marcador.png) no-repeat left center; 159 | padding-left: 20px; 160 | color: #a1a1a1; 161 | } 162 | 163 | /*Formatando formulários*/ 164 | 165 | label { 166 | display: block; 167 | cursor: pointer; 168 | margin-bottom: 5px; 169 | } 170 | 171 | input { 172 | padding: 5px; 173 | width: 125px; 174 | font-size: 0.9em; 175 | background-color: #fff; 176 | } 177 | 178 | input.submit { 179 | width: 80px; 180 | color: #fff; 181 | background-color: #b10333; 182 | border: 2px solid #870529; 183 | margin-top: 5px; 184 | } 185 | 186 | /*Formatando imagens */ 187 | 188 | img.imagem-principal { 189 | width: 98%; 190 | border: 3px solid #dfdfdf; 191 | } 192 | 193 | /*Formatando cabeçalhos*/ 194 | 195 | h3 { 196 | text-transform: uppercase; 197 | display: inline; 198 | font-size: 0.8em; 199 | padding: 3px; 200 | } 201 | 202 | .destaque h3 { 203 | background: #b10333; 204 | color: #fff; 205 | } 206 | 207 | .entrevista h3 { 208 | background: #de003e; 209 | } 210 | 211 | /*Formatando lista de notícias*/ 212 | 213 | #lista-noticias li { 214 | padding: 2px; 215 | border-bottom: 1px solid #ccc; 216 | height: 62px; 217 | } 218 | 219 | #lista-noticias li a img { 220 | float: left; 221 | margin: 5px; 222 | } 223 | 224 | #lista-noticias li a { 225 | text-decoration: none; 226 | } 227 | 228 | #lista-noticias li a h3 { 229 | font-size: 0.8em; 230 | padding: 0; 231 | color: #3e7ab9; 232 | } 233 | 234 | #lista-noticias li a p { 235 | font-size: 0.7em; 236 | color: #000; 237 | } 238 | 239 | #lista-noticias li:hover { 240 | background: #eee; 241 | cursor: pointer; 242 | } 243 | 244 | /*Rodapé*/ 245 | 246 | #container-rodape { 247 | background: #294c71; 248 | padding: 20px; 249 | } 250 | 251 | #rodape { 252 | width: 760px; 253 | margin: 0 auto; 254 | color: #fff; 255 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Notícias Cidade - Seu site de notícias 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 |
17 |

Notícias cidade

18 | 39 |
40 | 41 | 42 |
43 | 44 | 45 | 109 | 110 | 111 | 112 |
113 | 114 |
115 |

Última entrevista

116 |
117 |

Entrevista com Felipe Silva

118 | 119 |

120 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 121 |

122 | Leia mais! 123 |
124 |
125 | 126 |
127 |

Notícias recentes

128 |
129 | 130 | 171 | 172 |
173 |
174 | 175 |
176 | 177 | 178 | 179 |
180 | 181 |
182 |

Entrevistas

183 |
184 | 194 |
195 |
196 | 197 |
198 |

News

199 |
200 | 201 |
202 | 203 |
204 | 205 | 206 |
207 | 208 |
209 | 210 |
211 |
212 | 213 |
214 |
215 | 216 |
217 | 218 | 219 |
220 | 221 | 222 |
223 | 224 | 225 | 226 | 227 |
228 |
229 | © Copyright 2000 - 2019 Notícias Cidade 230 |
231 |
232 | 233 | 234 | 235 | 236 | --------------------------------------------------------------------------------