# Más ejercicios con CSS

**URL:** <https://foros.velneo.com/t/mas-ejercicios-con-css/9697>\
**Category:** Compartir código fuente y ejemplos\
**Created:** [4 Diciembre, 2017 11:13 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697 "2017-12-04T11:13:46Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [4 Diciembre, 2017 11:13 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/1 "2017-12-04T11:13:46Z")

</div>

Hola.

Ahora que llega la Navidad te apetecerá adornar tu aplicación con colores Navideños.  
Para facilitarte esa tarea pongo a tu disposición un gestor y comprobador Online de código CSS (basado en la OpenApp gdCSS de [guida21.com](http://guida21.com)).

Puedes acceder en: vatp://pruebas:pruebas@c6.velneo.com:16400/0PS\_\_MisCSS\_iapp.

- Dispones de una lista de los controles gráficos ( **Widgets** ) que puedes personalizar con CSS.
- Creas un CSS específico para un Widget concreto que llamaremos **Recurso CSS**.
- **Prueba** los **Recursos CSS** hasta que el resultado sea el esperado.
- Añade una nueva **Hoja de Estilo** que contenga un **conjunto ordenado de Recursos CSS**.
- Finalmente **exporta** la Hoja de Estilo a un fichero de disco en **formato CSS** para aplicar a tu aplicación.

Si tienes un CSS atractivo y quieres compartirlo, crea los Recursos CSS y estarán disponibles para otros usuarios.  
Cuando añadas nuevo CSS, la aplicación te pedirá un **nombre de Autor** para identificar tus aportaciones y ser propietario de ellas.

Tienes disponible inicialmentre 2 Hojas de Estilo, una de **ejemplo** que es la aplicada por defecto a la Aplicación y la Hoja de Estilo oficial de Velneo en VERP. Duplica los Recursos CSS y modifícalos a tu gusto.  
Espero tus aportaciones y sugerencias.

De momento es una aplicación para equipos de escritorio y pantalla de relación 16:9 o 16:10.  
En la agenda está un probador de CSS para Tablets/Móviles y un gestor de estilos para QML.

Saludos  
Paco Satué

P.D. La aplicación solo está disponible como herramienta de prueba y ejercicios con CSS y No es descargable.

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [12 Diciembre, 2017 08:09 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/2 "2017-12-12T08:09:22Z")

</div>

Hola.

He actualizado el probador CSS colocándolo en un Dock.  
De esta forma podemos adaptar el formulario del Probador CSS a la pantalla disponible e incluso colocarlo en otra pantalla.

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![jjsoft](https://avatars.discourse-cdn.com/v4/letter/j/7c8e57/32.png) [@jjsoft](https://foros.velneo.com/u/jjsoft)\
**Post date:** [13 Diciembre, 2017 07:12 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/3 "2017-12-13T07:12:58Z")

</div>

Gracias Paco

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [13 Diciembre, 2017 10:22 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/4 "2017-12-13T10:22:43Z")

</div>

Hola Juanjo.

¡¡ Qué bien sientan los agradecimeintos!! y qué poco cuestan.

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![tempsmollet](https://avatars.discourse-cdn.com/v4/letter/t/977dab/32.png) [@tempsmollet](https://foros.velneo.com/u/tempsmollet)\
**Post date:** [13 Diciembre, 2017 11:39 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/5 "2017-12-13T11:39:11Z")

</div>

Hola Paco,

Muchas gracias por compartir tu apreciado trabajo, de verdad.

He estado revisando las hojas de estilo, he mirado de exportar la Hoja de Estilos de Ejemplo a una de mis aplicaciones para ver que tal se ajustan los CSS a cualquier aplicación.

Y al copiar el código CSS a mi aplicación me sale el error: “Error: Símbolo desconocido: E”

He mirado de encontrar el citado símbolo, pero no he sabido encontrarlo. No se si es un error u otra cosa.

Saludos

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/velneo/original/2X/5/5cb31995708f651336879c570ee5e53bc2c3f460.jpg)

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [13 Diciembre, 2017 12:29 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/6 "2017-12-13T12:29:35Z")

</div>

Hola Ramon.

Cuando te ocurra esto es casi siempre un problema de las dichosas comillas dobles y el puñetero editor de f´romulas.  
En este caso hay 2 comillas dobles en el Recurso CSS – PS Cajas de Edición.

Busca esas 2 comillas con el Notepad++ y las eliminas ya que están en un comentario y no son necesarias.

En mis aplicaciones obtengo la Hoja de Estilo mediante una función remota a la aplicación MI\_CSS y en este caso las comillas no afectan.

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![tic-software](https://avatars.discourse-cdn.com/v4/letter/t/c4cdca/32.png) [@tic-software](https://foros.velneo.com/u/tic-software)\
**Post date:** [13 Diciembre, 2017 15:23 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/7 "2017-12-13T15:23:12Z")

</div>

Gracias por tu aporte Paco, es una app muy útil.

---

<div class="post-metadata">

**Author:** ![ccuesta](https://avatars.discourse-cdn.com/v4/letter/c/c77e96/32.png) [@ccuesta](https://foros.velneo.com/u/ccuesta)\
**Post date:** [15 Diciembre, 2017 10:41 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/8 "2017-12-15T10:41:51Z")

</div>

Genial Paco, ya lo estoy aplicando y disfrutándolo.

Buen trabajo, Gracias!!

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [18 Diciembre, 2017 07:45 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/9 "2017-12-18T07:45:44Z")

</div>

Hola.

El otro día se preguntó por la posibilidad de disponer de forma nativa de una calculadora popup al estilo del calendario.

Usando la acción “Mostrar subformulario popup” del control PushButton he preparado un ejemplo de calculadora básica.  
Lo que hace es usar la función EVAL de javascript para devolver el resultado de la expresión introducida,  
por ejem (23 + 5) / 12 + Math.sqrt(120)

Es el Recurso CSS “PS Calculadora popup” de la Hoja de Estilo “PS Ejercicios”.

Probadlo  
Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [8 Febrero, 2018 23:42 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/10 "2018-02-08T23:42:46Z")

</div>

Hola.

Tenéis ahora también la oportunidad de probar la **_calculadora QML_** en el mismo Recurso CSS “PS Calculadora popup” de la Hoja de Estilo “PS Ejercicios”.

Por otro lado, tenía un problema visual con la **Barra de estado**.  
Cuando mostraba el Porcentaje de la Barra de progreso, el icono forzaba un cambio de altura de la Barra de estado, produciéndose un molesto efecto visual.

Podéis consultar la solución en el Recurso “PS Barra de Estado”.

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![jjsoft](https://avatars.discourse-cdn.com/v4/letter/j/7c8e57/32.png) [@jjsoft](https://foros.velneo.com/u/jjsoft)\
**Post date:** [9 Febrero, 2018 06:48 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/11 "2018-02-09T06:48:05Z")

</div>

Muchas gracias por todo Paco.

---

<div class="post-metadata">

**Author:** ![maserrano](https://avatars.discourse-cdn.com/v4/letter/m/838e76/32.png) [@maserrano](https://foros.velneo.com/u/maserrano)\
**Post date:** [16 Mayo, 2018 08:32 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/12 "2018-05-16T08:32:39Z")

</div>

Buenos días Paco,  
En primer lugar agradecerte todo el aporte que haces a la comunidad.  
Me han servido de gran ayuda tus soluciones.  
Quería jugar un poco con la herramienta de CSS pero no puedo entrar en  
vatp://pruebas:pruebas@c6.velneo.com:16400

¿ Hago algo mal o hay algún problema ?  
Lo he intentado con vClient 22 y 23  
Saludos,

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [16 Mayo, 2018 09:27 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/13 "2018-05-16T09:27:17Z")

</div>

Hola maserrano.

Me alegro que mis aportes os ayuden con Velneo.

Disculpa, pero hace poco he cambiado el servidor del cloud de desarrollo.  
Ahora el acceso es a través de **vatp://pruebas:pruebas@c3.velneo.com:10180/0PS\_\_MisCSS\_iapp**

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![informatica3](https://avatars.discourse-cdn.com/v4/letter/i/9e8a1a/32.png) [@informatica3](https://foros.velneo.com/u/informatica3)\
**Post date:** [27 Mayo, 2018 20:07 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/14 "2018-05-27T20:07:30Z")

</div>

Muy buenas paco podrias decirme en el editor y probador que tienes de CSS que thema y mode tienes para que te salgan esos colores.  
O si me puedes decir otros para que salgan destacados las lineas

Gracias

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [28 Mayo, 2018 07:26 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/15 "2018-05-28T07:26:36Z")

</div>

Hola lsmsusvilla

La Hoja de Estilo aplicada es “PS Hoja de Estilo de Ejemplo”.

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![informatica3](https://avatars.discourse-cdn.com/v4/letter/i/9e8a1a/32.png) [@informatica3](https://foros.velneo.com/u/informatica3)\
**Post date:** [28 Mayo, 2018 07:52 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/16 "2018-05-28T07:52:49Z")

</div>

Una pregunta paco, los cambios que hagas en la presentación del código HTML, XML, CSS etc se pueden guardar posteriormente en velneo, o los ejemplos que hay solo son de lectura

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [28 Mayo, 2018 08:27 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/17 "2018-05-28T08:27:40Z")

</div>

Hola lsmsusvilla.

Sí, puedes exportar a un fichero CSS la Hoja de Estilo que hayas creado.  
Busca el Botón de menú “Exportar Hoja de Estilo” en la pantalla de Edición de la Hoja de Estilo.

![imagen](https://canada1.discourse-cdn.com/flex035/uploads/velneo/original/2X/f/ff5e08ab1d9a8b0d096fa998a6098b60f7067b7b.png)

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![informatica3](https://avatars.discourse-cdn.com/v4/letter/i/9e8a1a/32.png) [@informatica3](https://foros.velneo.com/u/informatica3)\
**Post date:** [28 Mayo, 2018 08:39 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/18 "2018-05-28T08:39:31Z")

</div>

Perdona paco no me referia al estilo CSS exactamente, me referia a en el probador de CSS para que cuando te sale el codigo CSS formateado te salga con esos colores ![Sin%20t%C3%ADtulo2](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/velneo/original/2X/6/67c48507497ddce779e24aa2c2bfe2ed6f5be9cf.png)

---

<div class="post-metadata">

**Author:** ![pacosatu](https://yyz1.discourse-cdn.com/flex035/user_avatar/foros.velneo.com/pacosatu/32/5131_2.png) [@pacosatu](https://foros.velneo.com/u/pacosatu)\
**Post date:** [28 Mayo, 2018 09:04 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/19 "2018-05-28T09:04:10Z")

</div>

Hola lsmsusvilla.

Eso se consigue usando la librería [Ace Editor](https://ace.c9.io/).  
El **Tema** usado es “ **eclipse** ” y el **Modo** “ **css** ”.

Tienes algún de uso ejemplo en los [Ejercicios del Editor de código HTML](https://foros.velneo.com/t/ejercicios-con-velneo/8866).

Saludos  
Paco Satué

---

<div class="post-metadata">

**Author:** ![informatica3](https://avatars.discourse-cdn.com/v4/letter/i/9e8a1a/32.png) [@informatica3](https://foros.velneo.com/u/informatica3)\
**Post date:** [28 Mayo, 2018 13:38 UTC](https://foros.velneo.com/t/mas-ejercicios-con-css/9697/20 "2018-05-28T13:38:45Z")

</div>

Ok seguire investigando a ver si lo consigo

[Página siguiente](https://foros.velneo.com/t/mas-ejercicios-con-css/9697.md?page=2)
