últimos mensajes de: WIитX

Mostrar Mensajes
Páginas: 1 ... 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 [25] 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 ... 134

241

Programación / Desarrollo Web / Re: Una pequeña ayuda con css y html

en: 5 Julio 2015, 11:52 am

Cita de: DarK_FirefoX en 5 Julio 2015, 03:52 am

Exactamente, el término es Responsive Web Design (Diseño Web Responsivo), se trata de predefinir el comportamiento/apariencia de las cosas de las páginas para adaptarse a distintas resoluciones de pantalla/tamaño de pantallas/distintos dispositivos. Deberías ser capaz de encontrar información sobre esto.

No se cual es tu objetivo, si quieres trabajar directamente desde 0, pero podrías revisar bootstrap, es un framework que te facilita el desarrollo web, trae muchas cosas muy útiles, haciendo un excelente uso de CSS, además de jQuery, y sobre todo, viene incluido un excelente soporte para el diseño responsivo.

Salu2s

Lo estoy haciendo desde 0 seria una "putada" pasar ahora a bootstrap ese nunca lo e tocado y ya la tengo casi terminada XD

En safari me aparece así:

Y en chrome así:

Mira os dejaré todo lo que llevo echo así a ver si pueden ayudarme un poco mejor por que ya estoy dando palos de ciego y ya también me comentas que tal el codigo y eso jejej

Una preview de como se ahora mismo en chrome:

html:

Código

<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
                <link rel="stylesheet" href="css/style.css">
                <title>WINTXCODERS | Inicio</title>
        </head>
        <body>
                <div id="perfil">
                	<img class="encabezado" src="./images/top.png"/>
                	<img class="perfil" src="./images/miguelmartin.png"/>
                	<div id="social">
                	</div>
                </div>
                <div id="add">
                <img class="yt" src="./images/yt.png"/>
                <iframe class="video" width="560" height="315" src="https://www.youtube.com/embed/4Z9SDv4JLNU" frameborder="0" allowfullscreen></iframe>
                </div>
                </div>
                <div id="nav">
                        <ul>
                                <li><a href="#"><i class="fa fa-map-marker"></i>home</a></li>
                                <li><a href="#"><i class="fa fa-comment"></i>forum</a></li>
                                <li><a href="#"><i class="fa fa-globe"></i>computer news</a></li>
                                <li><a href="#"><i class="fa fa-users"></i>team</a></li>
                                <li><a href="#"><i class="fa fa-gamepad"></i>wargames</a></li>
                        </ul>
                </div>
                <div id="contenedor">
                </div>
        </body>
</html>

css:

Código

body{
 background: url(../images/bg.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
 }
#perfil {
 	width: 18.8%;
 	height: 389px;
 	background: #FFFFFF;
 	border-radius: 4px;
    border: 1px solid #dadada;;
 	float: right;
 	margin-right: 350px;
    margin-top: 100px;
    position: static;
 }
#social {
 	width: 99.9%;
 	height: 35px;
 	background: #f3f2f0;
 	position: static;
    margin-top: 38px;
 }
#perfil .encabezado {
 	width: 99.9%;
 	height: 180px;
 	border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
#perfil .perfil {
 	width: 100px;
    border-radius: 100%;
    border: 3px solid #E4E3E2;
    margin-top: 30px;
    margin-left: 10px;
    position: static;
}
#contenedor {
    width: 42%;
 	height: 600px;
 	background: #FFFFFF;
 	border-radius: 4px;
 	border: 1px solid #dadada;
 	float: right;
 	margin-right: 30px;
    margin-top: 25px;
    position: static;
}
#add .video {
	width: 99.9%;
 	height: 200px;
}
#add {
	width: 18.8%;
 	height: 600px;
 	float: right;
 	background: #FFFFFF;
 	border-radius: 4px;
 	position: static;
 	margin-right: -361px;
 	margin-top: 520px;
 	border: 1px solid #dadada;
}
#add .yt {
    width: 99.9%;
	border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
ul {
    width: 42%;
    background-color: #FFFFFF;
    border-radius: 4px;
    display: flex;
    justify-content: space-between;
    border: 1px solid #dadada;
    float: right;
    margin-right: 30px;
    margin-top: 100px;
    position: static;
    outline-style: none;
 
}
ul li a {
    color: #888;
    display: block;
    font-family: 'cuprum';
    font-size: .85em;
    padding: .9rem 0rem;
    text-decoration: none;
    text-transform: uppercase;
    transition: all .2s ease-in-out;
}
ul li a:hover {
    color: #444;
}
ul li a i {
    margin-right: 15px;
}
*, *:before, *:after {
    box-sizing: inherit;
    margin: 0;
    padding: 0;
}
#nav .fa fa-map-marker {
 
}

242	Programación / Desarrollo Web / Re:	en: 5 Julio 2015, 03:20 am
Si muchas gracias dark por tu respuesta también con el ejemplo que me dejo Gus me vendrá de perlas intentaré añadirle alguna que otra cosa y listo gracias a los dos Ahora necesito buscar como hacer para que se adapte la web según el tipo de pantalla jaja que probe en mi portátil y salía mal los divs no se ajustaron según e visto se llama reponsive pero no encuentro como hacerlo si le pongo en vez de px un % al ancho del div funcionará? Enviado desde mi Aquaris E6 mediante Tapatalk

243	Programación / Desarrollo Web / Re: Re: Una pequeña ayuda con css y html	en: 5 Julio 2015, 03:04 am
Cita de: Gus Garsaky en 5 Julio 2015, 03:03 am Te hice una, salió parecida: ver fiddle Dios muchas gracias $:-\$ enserio pero me mirare el código así para la próxima no tengo que pediros ayuda saludos y gracias de verdad Enviado desde mi Aquaris E6 mediante Tapatalk

244	Programación / Desarrollo Web / Una pequeña ayuda con css y html	en: 5 Julio 2015, 02:12 am
Hola chicos mirar necesito una pequeña ayuda Necesito hacer una barra de menú se que se hace con una lista <ul> creo pero a la hora del css no se ni por donde empezar sabes alguna source que pueda coger el código y modificarlo a mi gusto? La barra quiero que quede así a ver si puedo conseguirlo que es lo único que me falta por hacer Gracias chicos!! Acabó de poner lo que llevaba echó y mis divs no se ajustan a las pantallas a la barra esta que mencionó arriba le tengo puesto 910px si le pongo en vez de px en tanto % se redimensionara según el tipo de pantalla? Saludos

245	Foros Generales / Foro Libre / Re: ¿Es infantil ver una película en tu primera cita?	en: 29 Junio 2015, 14:26 pm
Tiratela y luego dile que me presente a sus amigas

246	Programación / Ingeniería Inversa / Re: Despedida	en: 29 Junio 2015, 14:16 pm
Ojala se recuperé pronto! Saludos!

247	Informática / Software / Re: Software de ciber gratuito?	en: 28 Junio 2015, 19:21 pm
Gracias ya lo e logrado hice lo siguiente XDDD Tengo un ordenador viejo en el instalé el servidor el ordenador viejo tiene windows, el cliente lo instale en el ordenador que quería monitorizar desde el programa del ciber luego para no tener que levantarme y de todo Xd instale Teamviewer al ordenador viejo en el cual accedo desde MAC y listo

248	Informática / Software / Re: Software de ciber gratuito?	en: 28 Junio 2015, 02:53 am
Cita de: gck en 28 Junio 2015, 02:08 am No sé has probado con http://www.cbm.com.ar/ ? Es el cyber admin que más he visto en mi jodida infancia Namaste No puedo administrarlo desde MAC ya lo mire :C

249	Informática / Software / Software de ciber gratuito?	en: 27 Junio 2015, 21:51 pm
Alguien me dice algún software que no sea ciberadmin.net por favor quiero que en un ordenador ponerle por ejemplo 3horas y a las 3 horas que se bloquee el ordenador hasta que yo le de la orden o active más horas a ser posible compatible con Mac ya se que pido mucho T.T o que pueda administrarlo desde MAC o un teléfono móvil Gracias ;P

250	Foros Generales / Noticias / Re: El camión transparente ¿la solución a los accidentes en adelantamientos?	en: 26 Junio 2015, 03:25 am
Esta bien pensando y salvaría de muchos accidentes, yo soy una de esas personas que se expresan al ir un poco lento detrás de un camión o un ciclista XD

Páginas: 1 ... 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 [25] 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 ... 134