sábado, 19 de junho de 2021

Locais para Visitar em São Paulo

 Museu de Arte de São Paulo (MASP) Assis Chateaubriand 

Av. Paulista, 1578 - Bela Vista, São Paulo - SP, 01310-200 

Perto metrô linha 2 - Estação Trianon Masp 

 

 

Parque Ibirapuera 

Av. Pedro Álvares Cabral - Vila Mariana, São Paulo - SP, 04094-050 

LocalizaçãoMoemaSão PauloSP 

Perto Metrô linha 5 – Estação AACD Servidor 

 

 

Shopping 25 de Março 

R. Florêncio de Abreu, 418 - Centro Histórico de São Paulo, São Paulo - SP 

Perto Metrô linha 1 / Metrô linha 4 / Estação Metrô da Luz 

 

 

 

Rua 25 de março / Marco Zero / Praça da Sé / Catedral da Sé 

Perto Metro linha 1 / Metrô linha 3 / Estação Praça da Sé 

 

 

Centro Cultural Banco do Brasil 

R. Álvares Penteado, 112 - Centro Histórico de São Paulo, São Paulo - SP, 01012-000 

Perto Metro linha 1 / Metrô linha 3 / Estação Praça da Sé 

 

 

Pinacoteca de São Paulo 

Praça da Luz, 2 - Luz, São Paulo - SP, 01120-010 

Perto Metrô linha 1 / Metrô linha 4 / Estação Metrô da Luz 

 

 

Mercado Municipal de São Paulo 

R. Cantareira, 306 - Centro Histórico de São Paulo, São Paulo - SP, 01024-900 

Perto Metrô Linha 1 - Estação São Bento 

 

 

Avenida Paulista 

Perto Metrô Linha 4 - Estação Paulista 

Perto Metrô Linha 2 - Estação Consolação - Av Paulista 2163 perto da Rua Augusta 

Perto Metrô Linha 2 - Estação Trianon Masp – Av. Paulista 1230 Shopping São Paulo 

Perto Metrô Linha 2 - Estação Brigadeiro – Av Paulista 442  

 

Boulevard Monti Mare - Shopping 

Av. Paulista, 392 - Bela Vista, São Paulo - SP, 01333-020 

Perto Metrô Linha 2 - Estação Brigadeiro 

 

 

Rua Augusta 

Perto Metrô Linha 2 - Estação Consolação - Av Paulista 2163 perto da Rua Augusta 

 

 

Centro Cultural São Paulo 

Rua Vergueiro, 1000 - Paraíso, São Paulo - SP, 01504-000 

Perto Metrô Linha 1 / Metrô linha 2 / Estação Paraíso 

 

 

Parque Jardim Botânico SP / Zoológico de São Paulo 

Parque dos Dinosauros / Zoo Safari 

Perto Metrô Linha 1 / Estação Jabaquara  




 

sábado, 10 de abril de 2021

CSS Media Screen

CSS @Media Screen / polegadas x centímetros x pixel

Nos últimos meses, eu andei testando o CSS com o @media screen, e ao olhar o site em celulares, monitores e notebooks de tamanhos diferentes de polegadas, sempre aparecia algo precisando ser reajustado na visão esquerda ou direita do video, então pensei, e achei melhor ver o tamanho em polegada, comparando com o tamanho em centímetros, e comparando com o tamanho em pixel.  

iPhone320 x 480  | device-pixel-ratio = 2
iPhone 4640 x 960 | device-pixel-ratio = 2
iPhone 5, 5s640 x 1136 | device-pixel-ratio = 2
Samsung Galaxy S I and II480 x 800
Samsung Galaxy S III720 x 1280
iPhone 6750 x 1334 | device-pixel-ratio = 2
iPhone 6 plus1242 x 2208 | device-pixel-ratio = 3
iPad 1 and 2768 x 1024
iPad 31536 x 2048
Amazon Kindle Fire1024 x 600

Ao que parece, para funcionar direito o @media screen, será preciso:

1) criar uma página CSS só para visão pelo celular de 5", 6" e 6,5" polegadas

celular de 5 inch = 480px

celular de 6 inch = 576px

celular de 6,5 inch 16,5 = 624px 

/* mobile = Extra small devices (phones, 576px and down) */

/* styles for mobile browsers smaller than 480px; (iPhone) */

@media screen and (min-device-width:480px) and (max-device-width:624px) and (orientation:portrait) 

{ body { font-size: x-small; max-width: 100%; min-height: 10%; }}


2) criar uma página só para visão pelo tablet de 7" e 8" e 10" polegadas

tablet de 7 inch = 672px

tablet de 8 inch = 768px

tablet de 10 inch = 960px

/* #Tablets = IPAD devices / landscape 768px and up) */

/* different techniques for iPad screening / For portrait layouts only */

@media screen and (min-device-width: 672px) and (max-device-width: 960px) and (orientation:portrait) 

{ body { font-size: small; max-width: 100%; min-height: 10%; }} 


3) criar uma página só para visão pelo notebook de 10", 12" 14" e 15" polegadas

notebook de 12 inch = 1152px

notebook de 14 inch = 1344px

notebook de 15 inch = 1440px

/* #Laptop = Laptops devices /styles for browsers larger than 960px; */

@media screen and (min-width: 1152px) and (max-width: 1440px) and (orientation:landscape) 

{ body { font-size: normal; width: 100%; height: 100%; }}  


4) criar uma página só para visão pelos monitores de 15", 16", 17", 18", 19", 20", 21", 22" e 23" polegadas

monitor de 15 inch = 1440px

monitor de 16 inch = 1536px

monitor de 17 inch = 1632px

monitor de 18 inch = 1728px

monitor de 19 inch = 1824px

monitor de 20 inch = 1920px

monitor de 21 inch = 2016px

monitor de 22 inch = 2112px

monitor de 23 inch = 2208px

/* styles for browsers larger than 1440px; */

@media screen and (min-width: 1440px) and (max-width: 2208px) and (orientation:landscape) 

{ body { font-size: medium; width: 100%; height: 100%; }} 


4) criar uma página só para visão pelos monitores gamer de 24", 25", 26", 27", 28", 29", 32" e 42" polegadas

monitor gamer de 24 inch = 2304px

monitor gamer de 25 inch = 2400px

monitor gamer de 26 inch = 2496px

monitor gamer de 27 inch = 2592px

monitor gamer de 28 inch = 2688px

monitor gamer de 29 inch = 2784px

monitor gamer de 32 inch = 3072px

monitor gamer de 42 inch = 4032px

/* styles for browsers larger than 2208px; */

@media screen and (min-width: 2304px) and (max-width: 4032px) and (orientation:landscape) 

{ body { font-size: large; width: 100%; height: 100%; }}