[Duda] Resuelta - Cómo poner transparencia a los bordes del foro

Código:

/***BASE DEL FORO***/
#wrap {
padding: 20px;  
border: 30px solid #5f7390;  
  width: 900px;
  overflow: hidden;
    background: #fff;
}

body {
background-image: url('https://i0.pickpik.com/photos/300/812/964/conifers-dark-fir-trees-fog-preview.jpg'); /* Imagen del fondo */
background-attachment: fixed; /* Imagen de fondo móvil o fija */
background-size: cover;  
color: #000; /* Color del texto en general */
font-family: Arial, Helvetica, sans-serif; /* Familia de fuentes, tipografia */
font-size: 12px; /* Tamaño del texto en general */
padding: 0px; /* Distancia entre el foro y el borde de pantalla */
margin-top: 100px;
margin-bottom: 70px;  
}

Así es como se ve:

Y así es como me gustaría conseguir que se viese:

Roshio escribió:

Hota-chan escribió:

AMO ESTO. Es súper útil, había cositas que había aprendido de tanto editar colores y demás en códigos de uso libre, pero es genial entenderlo mejor y conocer más cosas de paso. ¡Gracias Roshio! Creo que está perfecto. Espero con ansias la parte 2 -rueda-.

Tengo unas preguntas sobre esto:

Roshio escribió:COLOR Especifica el color: black, red, white; rgb(128, 34, 60) o también #000000.

¿Qué diferencia hay entre las 3 maneras de hacerlo? Y especialmente, ¿cómo se usa la segunda?
Gracias por todo. Saludos :)

Hola Hota! Bueno trataré de responder tu duda, segun tengo entendido se utilizan de esta forma:

COLOR NAME Black, white, pink, red, blue, green, yellow, cyan, beige, etc. Utiliza un color por nombre especifico, a veces es más fácil usarlo cuando te lo sabes por ende, yo uso mucho el black y el white (xD)  

COLOR HEX VALUE #000000

#FF5399

#3CBEFF

#CCFF00

Se compone de 6 numeros o letras (pueden combinarse), y que siempre va a empezar con un simbolo #.

COLOR RGB VALUE rgb(0,0,0)

rgb(200,0,0)

rgb(76, 175, 80)

Este es un código que se centra en tres colores básicos que son RED (rojo), Blue (azul) y Green (verde), siempre utilizan números. Los colores RGB son los que utiliza nuestra pantalla o monitor.

En el CSS estos pueden servir también para dar una opacidad al color por ejemplo rgb(255, 83, 153)

rgba(255, 83, 153, 0.5)

rgba(255, 83, 153, 0.2)  

Espero haber sido clara, cualquier cosa avisame!

Código:


div.cosito {
     border: 20px solid rgba(138, 71, 71, 0.3); <------ el border es un borde que se agrega en el elemento
     outline: 20px solid rgba(0, 139, 139, 0.6); <------- el outline es un borde que se coloca por fuera del elemento
}