Experiments with HTML and CSS in Electron.js 4

- Andrés Cruz

En español
Experiments with HTML and CSS in Electron.js 4

Let's create the following page in the index.html of our Electron application:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            background-color: purple;
        }
        h1 {
            text-align: center;
        }
        #customId{
            display: block;
            width: 100%;
        }
        section{
            background-color: #FFF;
            font-family: Georgia;
            padding: 25px;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <main>
        <h1>Page Detail</h1>
        <img id="customId" src="https://cdn.pixabay.com/photo/2022/08/16/20/02/wallpaper-7391054__340.jpg" alt="">
        <section>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse dicta nulla asperiores, similique iure quas
                optio! Error quasi doloremque illo voluptatem, fugiat voluptate exercitationem, qui repudiandae officiis
                ipsa corrupti animi.</p>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse dicta nulla asperiores, similique iure quas
                optio! Error quasi doloremque illo voluptatem, fugiat voluptate exercitationem, qui repudiandae officiis
                ipsa corrupti animi.</p>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse dicta nulla asperiores, similique iure quas
                optio! Error quasi doloremque illo voluptatem, fugiat voluptate exercitationem, qui repudiandae officiis
                ipsa corrupti animi.</p>
        </section>
    </main>
</body>
</html>

And we will have:

 

Remember that the previous material is part of mi curso completo sobre Electron.js

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.