﻿<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Produção de Suportes Midiáticos &#187; Produção de Suportes Midiáticos</title>
	<atom:link href="https://suportesmidiaticos.eca.usp.br/?cat=1&#038;feed=rss2" rel="self" type="application/rss+xml" />
	<link>https://suportesmidiaticos.eca.usp.br</link>
	<description></description>
	<lastBuildDate>Fri, 06 May 2016 06:05:02 +0000</lastBuildDate>
	<language>pt-BR</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=4.2.1</generator>
	<item>
		<title>Endereços das instalações (login e principal) WP para os grupos (2016)</title>
		<link>https://suportesmidiaticos.eca.usp.br/?p=3706</link>
		<comments>https://suportesmidiaticos.eca.usp.br/?p=3706#comments</comments>
		<pubDate>Fri, 06 May 2016 06:04:45 +0000</pubDate>
		<dc:creator><![CDATA[Richard Romancini]]></dc:creator>
				<category><![CDATA[Sem categoria]]></category>

		<guid isPermaLink="false">http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/?p=3706</guid>
		<description><![CDATA[Grupo 1 Login &#124; Principal Grupo 2 Login &#124; Principal Grupo 3 Login &#124; Principal Grupo 4 Login &#124; Principal Grupo 5 Login &#124; Principal]]></description>
				<content:encoded><![CDATA[<h3><strong>Grupo 1</strong></h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress10/wp-login.php" target="_blank">Login</a> | <a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress10" target="_blank">Principal</a></p>
<h3><strong>Grupo 2</strong></h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress11/wp-login.php" target="_blank">Login</a> | <a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress11" target="_blank">Principal</a></p>
<h3><strong>Grupo 3</strong></h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress12/wp-login.php" target="_blank">Login</a> | <a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress12" target="_blank">Principal</a></p>
<h3><strong>Grupo 4</strong></h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress13/wp-login.php" target="_blank">Login</a> | <a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress13" target="_blank">Principal</a></p>
<h3><strong>Grupo 5</strong></h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress14/wp-login.php" target="_blank">Login</a> | <a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/wordpress14" target="_blank">Principal</a></p>
]]></content:encoded>
			<wfw:commentRss>https://suportesmidiaticos.eca.usp.br/?feed=rss2&#038;p=3706</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Alguns truques de CSS &#8211; 2</title>
		<link>https://suportesmidiaticos.eca.usp.br/?p=3432</link>
		<comments>https://suportesmidiaticos.eca.usp.br/?p=3432#comments</comments>
		<pubDate>Wed, 04 May 2016 08:35:40 +0000</pubDate>
		<dc:creator><![CDATA[Richard Romancini]]></dc:creator>
				<category><![CDATA[Sem categoria]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/?p=3432</guid>
		<description><![CDATA[1) Capitular O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome]]></description>
				<content:encoded><![CDATA[<h3>1) Capitular</h3>
<p><span class="capitalLetter">O</span> nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap). O nome da primeira letra maior de um texto é &#8220;capitular&#8221; (ou drop-cap).</p>
<p>O estilo pode ser aplicado na <strong>letra </strong>ou no <strong>parágrafo</strong> do texto que possuirá essa formatação. No caso da letra (sendo o estilo aplicado a partir da tag &#8220;span&#8221;), o código é o seguinte:</p>
<p><code>.capitalLetter<br />
{<br />
   float:left;<br />
   color:black;<br />
   background:white;<br />
   border:1px solid #999999;<br />
   font-size:100px;<br />
   line-height:90px;<br />
   padding:2px;<br />
   font-family:times;<br />
   margin-right: 5px;<br />
   margin-top: 5px;<br />
}</code></p>
<p>Veja mais informações (como o método para capitular como estilo de parágrafo) <a href="http://www.cristalab.com/tutoriales/como-crear-letras-capitales-con-css-c59982l/" target="_blank">aqui</a>.</p>
<h3>2) Texto em coluna</h3>
<p>A criação de um layout com colunas é bastante simples com CSS. É necessário criar um estilo que especifique o número de colunas e aplicá-lo a um bloco de texto (div). Exemplos de código e visualização do mesmo são mostrados abaixo.</p>
<p><code>.numero-colunas{<br />
   -moz-column-count: 2;<br />
   -moz-column-gap: 65px;<br />
   -moz-column-rule: 1px solid #ccc;<br />
   -webkit-column-count: 2;<br />
   -webkit-column-gap: 65px;<br />
   -webkit-column-rule: 1px solid #ccc;<br />
}</code></p>
<div class="numero-colunas">A temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</div>
<h3>3) Texto em coluna+capitular+foto</h3>
<p>É possível também combinar um texto em coluna com capitular e imagens. No caso, a foto recebeu um estilo (através de uma span), que é mostrado na sequência.</p>
<div class="numero-colunas"><span class="capitalLetter">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, <span class="image"><img class="redondo" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp" alt="Lula Ramires" width="250" /></span>alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</div>
<p></br></p>
<p>Estilo da imagem:<br />
<code>.image {<br />
      float: right;<br />
      margin: 10px;<br />
       }</code></p>
<h3>4) Texto+box, texto+olho e texto+vídeo</h3>
<p>A criação de um box, com ou sem fundo colorido, pode ser uma estratégia para dar mais atratividade a uma página. O box pode conter somente texto ou algum outro elemento, como uma imagem, e pode ser elaborado com algum código com CSS, como no exemplo abaixo.</p>
<p><span class="capitalLetter">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, <span class="box"><img class="redondo" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp" alt="Lula Ramires" width="250" /></br><br />
Lula Ramires, pesquisador e militante da causa LGTB</span>chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</p>
<p>Código do box:<br />
<code>.box {<br />
	float:right;<br />
	width: 300px;<br />
	margin: 10px 20px 20px 20px;<br />
	padding: 30px 30px 30px 30px;<br />
	background: #ddf;<br />
    text-align:center;<br />
    font-size: 16px;<br />
    font-weight: bold;<br />
    line-height: 100%;<br />
    font-family: times;<br />
    color:#333;<br />
    border-radius: 10px;<br />
	}</code></p>
<p>Um elemento de destaque que contenha apenas texto costuma ser chamado de &#8220;olho&#8221;. Abaixo um exemplo e código CSS de um &#8220;olho&#8221;.</p>
<p><span class="capitalLetter1">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, <span class="olho">Materiais didáticos são debatidos e disputados socialmente, tanto em termos de promoção, quanto de proibição</span>chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</p>
<p>Código do olho:<br />
<code>.olho {<br />
	float:right;<br />
	width: 280px;<br />
	margin: 10px 20px 20px 30px;<br />
	padding: 20px 10px 20px 15px;<br />
	border: 0px solid #1B486F;<br />
	border-width: 10px 0px;<br />
    text-align:left;<br />
	color:#333;<br />
	font: italic 1.4em/1.4 Georgia;<br />
	}</code></p>
<p>A inserção de vídeo na página é simples, basta copiar o código de incorporação fornecido pelos sites, porém é importante notar os valores de largura e altura e, se necessário, alterá-los. Abaixo um vídeo e seu respectivo código.</p>
<div class="numero-colunas"><span class="capitalLetter">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais<span class="image"><iframe width="380" height="214" src="https://www.youtube.com/embed/uLE4BfOtyI8" frameborder="0" allowfullscreen></iframe></span> tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</div>
<p></br></p>
<p>Códido de incorporação do vídeo<br />
<code>&lt;iframe width=&quot;380&quot; height=&quot;214&quot; src=&quot;https://www.youtube.com/embed/uLE4BfOtyI8&quot; frameborder=&quot;0&quot; allowfullscreen&gt;&lt;/iframe&gt;</code></p>
<h3>5) Fundos em texto</h3>
<p>Um fundo no corpo do texto (background) pode servir tanto para destacar determinada parte do site quanto para separar partes do mesmo, como no exemplo. Existem sites que geram códigos de &#8220;puro CSS&#8221; (sem imagem) para fundos (como esse <a href="http://enjoycss.com/" target="_blank">aqui</a>). O código do primeiro background (inserido como class de uma div) é mostrado abaixo.</p>
<div class="back">
<span class="capitalLetter2">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, <span class="olho">Materiais didáticos são debatidos e disputados socialmente, tanto em termos de promoção, quanto de proibição</span>chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</div>
<div class="back2"><span class="capitalLetter2">A</span> temática deste encontro, sinteticamente, objetiva estabelecer um eixo de discussão sobre o papel dos diferentes recursos pedagógicos na educação no Brasil atual. Como sabemos, a sociedade brasileira deposita grandes esperanças em relação à educação escolar e, não por acaso, o mote do governo federal é “Brasil, Pátria Educadora”. No entanto, a preocupação com o tema da formação nem sempre resulta em consensos sociais sobre quais direções seguir. O significado de “promover a cidadania” é disputado socialmente, <span class="olho">Materiais didáticos são debatidos e disputados socialmente, tanto em termos de promoção, quanto de proibição</span>chegando mesmo ao conflito aberto em diferentes arenas: as secretarias de educação e as definições de políticas públicas, os legislativos, em diferentes níveis, e outros espaços (imprensa, ONGs, etc.).<br />
Porém, parece existir, a despeito dos dissensos, o reconhecimento da importância dos materiais didáticos para formação dos estudantes e, em parte, dos próprios educadores – mesmo em negativo. Isso é exemplificado pelas discussões e práticas dos que buscam impedir a distribuição de materiais relacionados à abordagem pedagógica de conteúdos como o gênero e a diversidade sexual. Ao mesmo tempo, numa vertente propositiva, alguns grupos sociais tentam fazer com que a escola receba certo tipo de material educativo, ainda que o mesmo esteja em flagrante contraposição com posições fundadoras da educação pública moderna, como a laicidade. Este é o caso da proposta, atualmente em tramitação no legislativo do Estado de São Paulo, para a distribuição de um “kit bíblico” (composto por livros, vídeos e palestras) a ser dirigido aos alunos de ensino fundamental das escolas estaduais paulistas.<br />
Em resumo, a complexidade da temática possibilita vários ângulos de discussão. Nesse encontro são privilegiados dois enfoques, ligados a grupos sociais para os quais a ideia de promoção de direitos – em outras palavras da “cidadania” – parece fundamental e premente: os LGBTs e as “minorias” étnico-raciais brasileiras.</div>
<p></br><br />
Código do fundo do primeiro texto:<br />
<code>.back {<br />
  background: -webkit-linear-gradient(0deg, rgba(255,255,255,0.2) 0, rgba(255,255,255,0.2) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 100%, rgba(0,0,0,0) 386px, rgba(0,0,0,0) 100%), rgba(255,153,0,0.38);<br />
  background: -moz-linear-gradient(90deg, rgba(255,255,255,0.2) 0, rgba(255,255,255,0.2) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 100%, rgba(0,0,0,0) 386px, rgba(0,0,0,0) 100%), rgba(255,153,0,0.38);<br />
  background: linear-gradient(90deg, rgba(255,255,255,0.2) 0, rgba(255,255,255,0.2) 50%, rgba(0,0,0,0) 50%, rgba(0,0,0,0) 100%, rgba(0,0,0,0) 386px, rgba(0,0,0,0) 100%), rgba(255,153,0,0.38);<br />
  background-position: auto auto;<br />
  padding: 20px 120px 20px 120px;<br />
  -webkit-background-size: 60px auto;<br />
  background-size: 60px auto;<br />
  margin-left: -35px;<br />
  margin-right: -35px;<br />
}</code></p>
]]></content:encoded>
			<wfw:commentRss>https://suportesmidiaticos.eca.usp.br/?feed=rss2&#038;p=3432</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Alguns truques de CSS &#8211; 1</title>
		<link>https://suportesmidiaticos.eca.usp.br/?p=3411</link>
		<comments>https://suportesmidiaticos.eca.usp.br/?p=3411#comments</comments>
		<pubDate>Wed, 04 May 2016 00:26:11 +0000</pubDate>
		<dc:creator><![CDATA[Richard Romancini]]></dc:creator>
				<category><![CDATA[Sem categoria]]></category>

		<guid isPermaLink="false">http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/?p=3411</guid>
		<description><![CDATA[1) Imagem redonda Na primeira imagem não foi aplicado nenhum estilo, mas na segunda inseriu-se um estilo para que a borda ficasse redonda em 50%. O estilo CSS é conforme]]></description>
				<content:encoded><![CDATA[<h3>1) Imagem redonda</h3>
<div class="alinhadoesquerda">
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp"><img src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp" alt="Lula" width="228" height="227" /></a></p>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp"><img class="redondo" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/Lula.bmp" alt="Lula" width="228" height="227" /></a></p>
</div>
<p>Na primeira imagem não foi aplicado nenhum estilo, mas na segunda inseriu-se um estilo para que a borda ficasse redonda em 50%. O estilo CSS é conforme se segue:</p>
<p><code>.redondo {<br />
border-radius: 50%;<br />
}</code></p>
<p>O nome do estilo (no caso uma &#8220;class&#8221;) é indiferente, o importante, porém, é que ele seja repetido, para ser marcado, dentro da imagem, que passa a ter o seguinte código:<br />
<code>&lt;img <span style="color: #ff0000;"><strong>class="redondo" </strong></span>src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/evento_suportes_foto.jpg" alt="evento_suportes_foto" width="669" height="438" /&gt;</code></p>
<p>Uma explicação mais detalhada pode ser vista <a href="http://www.misselsoft.com.br/blog/2013/05/imagens-redondas-com-css/" target="_blank">aqui</a>.</p>
<h3>2) Imagem com cantos arredondados</h3>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/evento_suportes_foto.jpg"><img class="redondo aligncenter" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/evento_suportes_foto.jpg" alt="evento_suportes_foto" width="669" height="438" /></a></p>
<p><a href="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/evento_suportes_foto.jpg"><img class="redondado aligncenter" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/evento_suportes_foto.jpg" alt="evento_suportes_foto" width="669" height="438" /></a></p>
<p>A primeira imagem tem cantos arrendados com a mesma codificação do exemplo anterior, em 50%. Já na segunda, o valor é de apenas 5%. É possível definir que todas as imagens de uma página tenham um mesmo padrão de arredondamento, aplicando um estilo à imagem: veja <a href="http://www.devmedia.com.br/css3-bordas-arredondadas-dica/28718" target="_blank">aqui</a> como fazer.</p>
<h3>3) Moldura e sombra em imagens</h3>
<div class="alinhadoesquerda">
<p><img class="moldura_sombra" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/fim_evento.jpg" alt="fim_evento" width="441" height="251" /></p>
<p><img class="sombra" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/fim_evento.jpg" alt="fim_evento" width="441" height="251" /></p>
</div>
<p>Na imagem da esquerda (acima) foi aplicado um estilo para a feitura de moldura e sombra (código abaixo). Na da direita, apenas a segunda parte do código foi usada para a sombra.</p>
<p><code>.moldura_sombra {<br />
padding: 6px; <span style="color: #0000ff;">/* define a espessura da moldura */</span><br />
border: 4px solid #ffffff; <span style="color: #0000ff;">/* define a espessura da borda e cor */</span><br />
border-radius: 5%; <span style="color: #0000ff;">/* define o raio da borda */</span><br />
<span style="color: #0000ff;">/* coloca a sombra */</span><br />
box-shadow: 3px 6px 8px 1px rgba(0, 0, 0, 0.3);<br />
-moz-box-shadow: 3px 6px 8px 1px rgba(0, 0, 0, 0.3);<br />
-webkit-box-shadow: 3px 6px 8px 1px rgba(0, 0, 0, 0.3);<br />
}</code></p>
<p>A cor e outros parâmetros da sombra e da moldura poderiam ser diferentes. Ver explicação em mais detalhes, <a href="http://interessespessoais.com/programacaoweb/efeito-sombra-imagens-html5-css3/" target="_blank">aqui</a>.</p>
<h3>4) Legenda e crédito em imagem</h3>
<div class="wrapper"><!-- image --> <img src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/entrevista_lula_rafael.jpg" alt="" /><!-- description div -->
<div class="description"><!-- description content -->
<p class="description_content">Lula Ramires e Rafael Ferreira Silva sendo entrevistados pelos alunos de Educomunicação</p>
<p><!-- end description content --></p>
</div>
<p><!-- end description div -->
</div>
<p>Por códigos CSS também é possível colocar legenda em imagens, com diversas possibilidades de formatação. Acima está um caso de texto interno à imagem sobre um fundo translúcido. O código utilizado foi o mesmo desta <a href="http://web.enavu.com/tutorials/making-image-overlay-caption-using-css/" target="_blank">página</a>, porém, sendo feitas adaptações nas definições de estilo para adequação à foto usada. Abaixo, o que se mostra é uma adaptação maior ainda do código anterior, pois optou-se por colocar a legenda abaixo da imagem.</p>
<p></p>
<div class="wrapper1"><!-- image --> <img src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/entrevista_lula_rafael.jpg" alt="" /><br />
<!-- description div -->
<div class="description1"><!-- description content -->
<p class="description_content1">Lula Ramires e Rafael Ferreira Silva sendo entrevistados pelos alunos de Educomunicação</p>
<p><!-- end description content --></p>
</div>
<p><!-- end description div -->
</div>
<div class="credits">Foto: Ricardo Alexino Ferreira</div>
<div style="margin-top: 380px; margin-left: 100px; margin-right: 100px; position: relative;">A imagem acima também exemplifica a ideia de colocar um crédito na foto. Nesse caso, foi utilizado um estilo como o abaixo:</div>
<p><code>.credits {<br />
  position:relative;<br />
  top: -25px;<br />
  left: -270px;<br />
  color:black;<br />
  text-align: right;<br />
  font-size: 12px;<br />
}</code><br />
Os valores de top e left dependem de cada projeto. Ver mais informações <a href="https://wordpress.org/support/topic/add-text-under-featured-image" target="_blank">aqui</a>.</p>
<h3>5) Legenda dinâmica em imagem</h3>
<div id="mainwrapper">
<div id="box" class="box"><img id="img" src="http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/wp-content/uploads/2016/05/entrevista_lula_rafael.jpg" alt="" width="660" /><br />
        <span class="caption simple-caption">
<p>Lula e Rafael em entrevista aos alunos de Educomunicação</p>
<p>        </span>
</div>
</div>
<div style="margin-top: 420px; margin-left: 100px; margin-right: 100px; position: relative;">O CSS também permite a feitura de legendas (e outros tipos de texto) com comportamento dinâmico, ou seja, a partir da ação do usuário. Então, no exemplo acima, a legenda aparece quando o mouse é colocado sobre a imagem. A codificação é um pouco trabalhosa, mas depende sobretudo de atenção e compreensão dos parâmetros do estilo. Vários exemplos de legendas dinâmicas, como a mostrada acima, são dados <a href="http://www.hongkiat.com/blog/css3-image-captions/" target="_blank">aqui</a>.</div>
]]></content:encoded>
			<wfw:commentRss>https://suportesmidiaticos.eca.usp.br/?feed=rss2&#038;p=3411</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Reflexões biográficas sobre Suportes Midiáticos</title>
		<link>https://suportesmidiaticos.eca.usp.br/?p=3401</link>
		<comments>https://suportesmidiaticos.eca.usp.br/?p=3401#comments</comments>
		<pubDate>Fri, 11 Mar 2016 18:18:32 +0000</pubDate>
		<dc:creator><![CDATA[Richard Romancini]]></dc:creator>
				<category><![CDATA[Sem categoria]]></category>

		<guid isPermaLink="false">http://143.107.95.102/prof/richardromancini/suportesmidiaticos/public_html/wordpress/?p=3401</guid>
		<description><![CDATA[Experiências que tive com Suportes Midiáticos e Tecnologia &#124; Anna Luiza Guedes Teixeira Minha relação com os suportes midiáticos &#124; Caio César Treft Como o uso das tecnologias e suportes]]></description>
				<content:encoded><![CDATA[<p><img class=" alignleft" src="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/book-2.jpg" alt="" width="240px" /><strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Anna_Luiza_texto_1.docx" target="_blank">Experiências que tive com Suportes Midiáticos e Tecnologia</a></strong> | Anna Luiza Guedes Teixeira<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Caio_texto_1.docx" target="_blank">Minha relação com os suportes midiáticos</a></strong> | Caio César Treft<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Camilla_texto_1.docx" target="_blank">Como o uso das tecnologias e suportes midiáticos alteraram minhas percepções ao longo da vida?</a></strong> | Camilla Zarbinati<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Carla_texto_1.docx" target="_blank">A presença de suportes midiáticos no meu processo de aprendizagem</a></strong> | Carla Beatriz Grella<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Carolina_texto_1.docx" target="_blank">Qual minha relação com suportes midiáticos (tecnologia) durante minha vida</a></strong> | Carolina Germano Nascimento<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Eduardo_texto_1_1.odt" target="_blank">Os suportes midiáticos e suas influências em meu desenvolvimento</a></strong> | Eduardo Fonseca Darmaros<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Elena_texto_1.docx" target="_blank">Qual a sua relação e experiências com suportes midiáticos?</a></strong> | Elena Oliveira<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Jefferson_texto_1.docx" target="_blank">Os Suportes Midiáticos na Escola Estadual dos Anos 80/90</a></strong> | Jefferson Onoe Ganev<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Jessica_texto_1.docx" target="_blank">Como os suportes midiáticos podem auxiliar na aprendizagem: Minha história</a></strong> | Jéssica Vassaitis<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Paulo_texto_1.docx" target="_blank">Suportes midiáticos que influenciaram em minha aprendizagem</a></strong> | Paulo Henrique Marinho Lopes<br />
<strong><a href="https://dl.dropboxusercontent.com/u/1524601/Suportes/2016/Texto%201/Rafael_texto_1.docx" target="_blank">Reflexões sobre Suportes Midiáticos para a Educação</a></strong> | Rafael Hanashiro</p>
]]></content:encoded>
			<wfw:commentRss>https://suportesmidiaticos.eca.usp.br/?feed=rss2&#038;p=3401</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
