Continuando con el tema del chat es momento de embellecer nuestra lista de usuarios.
Es el momento de crear y modificar el archivo chatStyle.css en la carpeta raíz/css/chatstyle.css, para ello, lo creamos y comenzamos a agregar los estilos a las diferentes clases.
chatstyle.css
Esto dejara una lista de usuarios con el siguiente estilo
Es el momento de crear y modificar el archivo chatStyle.css en la carpeta raíz/css/chatstyle.css, para ello, lo creamos y comenzamos a agregar los estilos a las diferentes clases.
chatstyle.css
body { font: 13px Helvetica, Arial; } .contentUser { border: solid 1px; width: 300px; position: absolute; top: 10px; left: 10px; border-radius: 5px; height: 500px; } ul#usersActivos { list-style: none; padding: 0; height: 445px; overflow: hidden; overflow-y: scroll; } .title-users { padding: 1em; background-color: #2f2f5d; text-align: center; color: #f1f1f1; cursor: move; } #usersActivos li { border-bottom: solid 1px; padding: 0.75em; cursor: pointer; } #usersActivos li div { font-size: 1.15em; }
Esto dejara una lista de usuarios con el siguiente estilo
Y es así como concluimos esta entrada...
Esperare sus comentarios, si no se han unido al blog, agrégalo como favorito.
No hay comentarios:
Publicar un comentario