Scribd Logo
Upload

Welcome to Scribd!

  • Tugasweb1html B F1D019011

    Uploaded by

    FAL CONE
    5 views7 pages
    This document contains source code for a web simulation project. The code includes HTML, CSS, and JavaScript to create a login page with a sign in form and style elements. Upon successful login, it directs to a profile page displaying basic user information and a profile image. The code demonstrates skills in building web pages with forms, styling elements, and page navigation between HTML files.

    Original Description:

    Original Title

    Tugasweb1html_B_F1D019011

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains source code for a web simulation project. The code includes HTML, CSS, and JavaScript to create a login page with a sign in form and style elements. Upon successful login, it directs to a profile page displaying basic user information and a profile image. The code demonstrates skills in building web pages with forms, styling elements, and page navigation between HTML files.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    5 views7 pages

    Tugasweb1html B F1D019011

    Uploaded by

    FAL CONE
    This document contains source code for a web simulation project. The code includes HTML, CSS, and JavaScript to create a login page with a sign in form and style elements. Upon successful login, it directs to a profile page displaying basic user information and a profile image. The code demonstrates skills in building web pages with forms, styling elements, and page navigation between HTML files.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 7

    Nama : Arya Agung Laksamana Dwikananda Sedana Putra

    NIM : F1D019011
    Kelas : B

    TUGAS PEMROGRAMAN WEB


    1. Source Code
    a. Simulasi1.html
    <!DOCTYPE html>
    <html>
    <head>
    <title>Web Simulation</title>
    <meta charset="utf-8">
    </head>
    <body>
    <style type="text/css">
    element.style{
    background-color: #81007F;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 100% 100%;
    }
    .bgpage{
    width: 300px;
    padding: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
    text-align: center;
    }
    </style>
    <div class="penanda">
    <b>Sign In</b>
    <style type="text/css">
    element.style{
    }
    .penanda{
    text-transform: uppercase;
    text-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    font-family: "Motiva Sans", Sans-serif;
    font-size: 30px;
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
    font-weight: 200;
    letter-spacing: 2px;
    }
    *{
    padding: 0;
    margin: 0;
    }
    div{
    display: block;
    }
    </style>
    </div>
    <div class="login">
    <form name="login" action ="simulasi2.html" style="display: block;">
    <table align="center" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td><input type="text" placeholder="Username"></td>
    </tr>
    <tr>
    <td><input type="password" placeholder="password"></td>
    </tr>
    <tr>
    <td><input type="submit" value="login"></td>
    </tr>
    </table>
    </form>
    <style type="text/css">
    element.style{
    }
    .login{
    text-align: center;
    padding: 40px 20px 20px 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    }
    </style>
    </div>
    </body>
    </html>
    b. Simulasi2.html
    <!DOCTYPE html>
    <html>
    <head>
    <title>profile</title>
    </head>
    <body>
    <div class="tengah">
    <p>Nama : Arya Laksamana</p>
    <p>NIM : F1D019011</p>
    <p>JURUSAN : TEK. INFORMATIKA</p>
    <img
    src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxITEhU
    TEhMVFRUXGBUXFRcYGBcVFRUXFxUXFxUYFRUYHSggGBolHRUXITEhJSkrLi4uF
    x8zODMtNygtLisBCgoKBQUFDgUFDisZExkrKysrKysrKysrKysrKysrKysrKysrKysrKysrK
    ysrKysrKysrKysrKysrKysrKysrK//AABEIAQ0AuwMBIgACEQEDEQH/
    xAAcAAABBQEBAQAAAAAAAAAAAAAEAQIDBQYABwj/
    xABBEAACAQIEAgcFBQUHBQEAAAABAgADEQQSITEFQQYiUWFxgZETMpKhsQcj
    QsHRM1KC4fAUU2JyorLSFkNjg5Mk/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/
    EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/
    AA3Y9p9ZX1qhvufUwt20gFVoBWHJ/
    ePzktcsRufUyHBGEVtoAVPNr1j6mQYpmt7zephVORY1dIFUrvf3m9TLrA5v3m9TKhd5ari
    UpJmqMEHfue4Aak+EArEBwPeb1MAUPf329TKniHTG9xSp27Gfn/CDp6zPYjjWIa96jC/
    JeqB4W1gb6vnA1dh4sR9TK8Y5F97ED47/AEMwe5uxJPaSSfUxtaprYQN//wBQ0Rp/
    aCfD2n1tCcDjhVPUr5jvbMQ3wnWea02hNKpY3B17diO8QPTGaqPxv8TfrHrWe3vv8R/
    WZzgHSEsRSrG9zZX535Bu3xmoanaBXvial/2j/E36xKuIqf3j/E36zqiaxteAJisTVt+0f42/
    WVjYmtf9rU+Nv1ljjNpWAawFOKrX/bVPjf8AWSYjGVcv7Wp8bfrImp6xMcOrAipY2t/
    e1fjf9ZcYHEVygtXrDfaq45nleUOHE0fDSBTXTt7f3jAtDBHEIJg7GATgxCag0g+FMnqbQ
    B6I1kOOEmpbmC8XqZUZhuASPG0Cj4hxNaRstmb5Dx7+6Z/
    HYt6jFmJJ+g7BIXe5JOp5xl4CZol5zGRhoE14MxkjNpIYEqmTK0FWSXgFgz1PA1vaUKdT
    myLfxtY/
    MGeTqdJ6J0Kr5sJb9x2XyPWH+6AS66yKvJ6l80GrXvABxggCLrLDGiB0KZvAVV1kXER
    YQukmsH4oDaAHhl0lzg3sgFr7/UyrwaG00GAIFMAgc/
    qYBLnSDOZO7QUtrAMwhhNU6QbCiFPtAFpDWVvSGpak/hLJBKXpc1qJ7yo+d/
    ygYl2jLxxjCICGcpnWiQOcdkZHxoEBVjwJyKJIIDkWbb7PqoyVqd9bq48CCp+g9ZjlEu+h1f
    JikF9HDIfMXX/
    UFgbKousEq77SyqprA3XWBXYuQ0BCMWNYzDpAWiNYBxYy1oJrKrjI1gMw20OptpAq
    CWAhiiBZO0hMJqJB7QDMIITV2kOEWT1k0gD0Fma6cPZaanmxPoP5zV4dZi+nLXqoo/
    ChPxH+UDMVDEScUi2gIROyzjbnJcPh3f3Fdv8AKrN9BAHqRqyyPBcSdsPXP/
    qqf8Yg4HieeHr/APyqf8YAaLJAO+FjhOIH/Yrf/J/+M44Ct/c1R/
    63v9IEKyahUKsrA6qQw8Qbj6RPYOPeVh4gj6yMa7H84Hrz2brDYgEeBF4BVp6zuh9f2mD
    pk7rmT4TYfK0KenqYFHil1j8PS0k+JpayajT0gD0KW8qeMJrNHhqPdKfjVLXzgAUE0ELV
    dI2jT0EIFOAcyaSHJCSIwCARhBCaq6RuEWEV10gC4dZgOmLg12NxpZfQXPzJnoWHE89
    4tTV8W7XJUuWJ0Ayg62HZcW79YEXCejNbEZTcIpO538lnp3AvsxwSBWq5653s5snwrb5
    zNdEapfErTY3115202HdqTPYkAFoAvDuCYWiPu8PRTstTUH1teWiOLcgB5CZLpjxirSp5a
    AOdtL5ScutjbleZnB9EuIYrrVKrJTvezMW/
    0k6wPUFxtDNl9qhbewdSbdtrx+ZW2MxOC6ErR1L3O91UJryJt/XhNDgqOS2pJ2vffx7/
    ANIFkqwbH4ylSXM7W0J/r+uUne9pi+KqcXX/
    ALOltNXY7KNvWBQcf+0RyxTD0lKi+rgm9uYA9ZiOLcWau33tNAe1VymeyJgOH4SmXcI
    QPeqPlC37AWsD5XmR6T8TwOKsKWTN+Erpfu2BgDfZ7TYUKynYVer8K3/
    L1lwV1Mo+huMWnUq4dr3YhkPI9UXB9JfHcwK+umsJo0+rIqi3MsFXqwI6KaSh4wvWHjN
    TRTSZziydcQB6KCS+zklNNpOqDvgSskYEhdSnG+zgSYRZNil0i4NZLil0gDcMwzVGCIC
    zHkPme6Y3pfwqvhHb2lIjMeq+pBG9iQct7km3fvvPTOidFstUobOSiA/uhjqfpNMOHg0jSq/
    epazB7EnvBgeD/Z/Xti1J3Nx67z3RNp5Hxno//YeIUvZAtTc3T/
    DrYqT3XHlPV6FS8AbHCmh9o4JtsN/
    hHI98z9fjvEa1Ks+HohAikoratUI1sEUg3tzJHZl5zarRB3F5KuFp3vl17tPmIHivRrH8QxJqvU
    v92t7svs7vmAyKwsQbX7bWnqHAg7Uw1TQ2Gh3htbCoW0BPjtDaNEKvfA6pbITMPwXDf
    /
    oxBJ1cdW5sCRewa3LU+k2tLUMJijU9liijGwfY9hvA7pH0aTEYX2dRmFYEEVAuZRa4yqg
    91LHYdx1mNPRWyoi5nfOWaqQUAB5Kp1PLU9k9SIbtkZw99TaB5HXwzYfFU2OtiuvnY
    X9ZrmOplb0uog4imo5st/
    WWCneAPfrSxI0lag68uMvVECWgllmc4mv3gmppjqzOY1fvICLT2i5ITk0EYRAJqrORZJU
    nUQIE2HSJjRpJ8Os7ErpAf0QxeSoUOz2t/
    mXUTaVm2A0Jv9Z5woI1B1GoPYRqJu+F4tcRSDjfmOauN/
    pAreMYXKEucxBtc77RmHq2hvHL5dRsQQRz3B05cpV021gaHC1oWBeU2He0saWIgTFb
    QOvjRfKN4/G4qymU4ptRHt6mxvm/wjkYFvhL5pkum/DiSGGhvoe+TcH6T4mu1Sr/
    AGUjDqSKdRWGeoBuRTsCR3iY/
    p502LWTDhs6sC2dSALa2ynUwN7wHHe1p5Ht7WnZag+jeB/
    WS42tkBmBocVd+IUa9BKmRgqVOqwVgw62pGwNjfuM1vHa3VPgYGF4hiDUxadz/
    TX8pbKd5S8Mol6zPyTXzNwPzlmjbwJKB60tydBKfCnrS2J2gHLoszGKb72aVn6kylRr1oFu
    pi2iINpLkgNqbSSiIOzSWiYFhRnYradRMTFnSAGo0MF4VxtsLVvq1Nj11H1HeIUh0MouIb
    wPRMZxzDVKPUcMWsAB7wN+Y5StpbzL8HTSabDNoD/
    XhAt6a6SenIKJuJMjQJDYkXhbVwdJV417EdlpUYrpfRoixDO97BQrWJ9NfKBo67EDTslJx
    CkrAOVBPbYGUw4zjqwzChWAuLAKKYt/
    GQx84HjE4hVJLU2QC1s1RVA77ITrAM4jisi+Egq4s1aGbmbjzGky9fG1yShs+U2Yhwy6b2J
    AOnnLd6hp4amBuxqHyzG30gB8CQhKx/
    xAegv+clp85Jgky4YdrEt6nT5WkNI6GBJgj1pbtylVgB1pbuNRAKq+55TLKPvjNNijZPKZT
    DveqYF8oMIyjt+UipSbNADtJaW8GzSam0CypGMxbaRlJtJHi30gJSfQyh4i2st6R6spMf70Cx
    4QdJe4OpqUPPUdxH8vpKThWwhtarlKt+6QfQwNNhXtJWaCXsbrtv4gybOD3QJw194SaY
    YWv5cvSB0SLwlTrAExFGqgJpgN3ZiszmNTF1bg01QcyXJ9Bb6zcIFG5lfj6iQPOMfgVpAq
    Ddjuf0HIQWtXZwlNb39weZuT+flLPjpu9l11tCOAcIIKV22LZaY7RY5n8+XdAbxGy0wBsA
    APLaVtA6S16SUihIPbp3iVFA2WAbw33tZZj3pW8LOss6Qu0CTHt1DMrgdapmn4n7nlM1w
    xfvDaBoaRkvpGUpNApg8npvrAryZHgWlJo3GPpIqVWWy9GMRVsQFVSAczHSx8BAp6b
    dWU+KF2sNdZ6LQ6PYWghOIqhraltUUd28rfb4RqmbCYSpiHFivs1IpAjn7R7IPLWBV4Lh
    FdUDNSdQbAXB57abiNr4dndaS+8zBLcwT2jlbea7C4XieK61eouDTklK1SvbvqNdF8lvL7g/
    A6OHzFASzG7O7GpUY7au2vKBTcY4eKWQKOplVR4qLa+IF/
    WVus2mMoLUUq2x+R5ETKYvDNRbK23JuR/
    nACquRqJGeJW3lpQRWFiZWcR4XrobwGPxJmGkExVVrEkhRuSxAkWM4fUVfu2UNyG5
    PcBF4V0YqswfG5iN1Q7d2b9IDOC8MFc5iD7Lmx0NW34UG4TtPPaX7OHrKoACoPIdg9P
    rJeJYpaVMm1gBsPQAd5NhB+BUzlzt7zG58T2d3LygO4tw9a/
    UcGxO43HeJUJ0JqhsrOvs9bVALnuBU2sfO00iFjWUKL66+E0gUEEMAQRYg6gjncQPPl6
    G1qa5w6sPNT57yBcDUQ9ZT9R6ibDEcJqp1sNUBH91VuynuWqOsnnmHcJA3Gwoy4qi9G
    2hLLmpnvWsnV9bHugY3jBIUzO8GHXJnqOP4Vhq6dUgqbnOjA+hGhlC3Qg071KNQMu9
    nIB7+tt5G0CuSSZpNTwFYtl9m1+y0iek4NipBG4sYA9LoxiyVBpZASBmYgKLi9zY3+U0X
    /AEphaOV6+I6q/tASFUnuY7D5wzEYXimI3elhU5WHtqgHnZAfWLhugVAtnxD1MS/
    bVYkeSjQDugV9bplhf2eEoPiGFwBSpXUdnWYfMXkmCp8XxWrMmCpdlhVrEd1+qJssNg
    kpjKiKo7AAB8oQBAz2A6H4VCGqBsRU3z1z7U3/
    AMKnqr5CaFNBYaAcohE6At44xosNTODXFxAYZHiMOrqVcXB/
    rTskrCI7hQSxsACSewDeBj+OcLqUBmpEvzC6Z7DcgfiHhBuB0q+I1tlHN2BAHgp976d88e
    6X8aq4vF1a1QsOsy01v+zQGwUdm1z2kmG/
    Zx0gODx1NmJ9lUtSqi+lmPVb+FrHwLQPoDA8Np0thmbm7asfPkO4WEJqaxzGRiAJW4VS
    exdAbG4HK/baI+EQaBQPDSHtK/
    itFnpVVpgM7U3VQxst2UgXPZrAKoUFTYb79pkg3mTwvDatELTUVVvXogsuiiiiAk2DHL
    mIyntvewmqJ1gKDbSdUB5eY5GJH3gVWI4JQYllQ0nO70iabH/
    Nl0bwIIgdXDYqmLIVxCaXDWpVhY3uCBkY91k8ZfGNywM2nEqIYCsXwznSmagCdY3v
    ZjdG8id4a7uTfM2vYTbx009JZ4jDq4KuoYcwQCD5GUp6K4XlTKjsV3RR4KrADyEDWAC
    OjVMWBxjY8xAICARLRYkCDE0SzKdOrr8x+kkQWAEcTG5oCtKvpLTZ6BpobNUZEB7
    AWGY+gMtJW43EKKtME2CK9Vz2BVK6+p9IHz506wyU8fiUT3Ve3nlXNfzvIOjPB3xWIp
    0k3Y7/
    ALo3LHuABMg43j2xFepWa16js+nebgeWgmu+xjHrTxzU2t97TYKeYZetYeKhvQQPbKQs
    oW5NgBc7mwtrHrEB1jjAaxjVjjOtAS8aI604wOAg9VyzZUNrEFj2Dew7zH1CTovmez+cfT
    QKLD+u+A4xCIoM4wGxMscYwwDKbySRUxJQIHRROimA0xDFiQGmNj40wOmI+0nHC
    hhMRYgPWCU1/es18/lZW9ZtjPMvtrwV0w9YD3Wemf4gGH+w+sDyC0vOgz5eIYU/
    +VR6gg/IypKS46E0s2Pwo/8AKvy1/
    KB9EBdfCOjrToDJ1o60WBGTGx5ETLAaBFAjrTrQGTjHMImWB0YWklpGYBqCSARlO
    SGB04mIBFMBpiGOiGAwxpj7RIDJnPtD4d7bh9cAaoBUXxpnMfkDNJEemGBU6gggjtBFj
    A+XSk9B+x/
    gPtK7Yph1aIyp31HFj6KT8QmR4rw5qNepQsbo7IO02Nlt4ix857z0S4MMJhKdH8QGaoe121
    b028hAtZ06JAUxCZzN6zgICWiR0QiAk4CcIsBpE4TmjhAaYJVrWJELaV1ZLkwLtRHRgaS
    WgJFiRYHRDHWiFYEZiR5EYYHATrRRFtAxOO6KipxhMQV+7CCq3YaqHKo/2t/
    DNqY60SBHaIRFdrf1vFRTz3gMCzo5hEMBLRIonQOAnWiidAYRFtHWjYEbyKmmnr9ZI
    86mtgBAKorJ7RFEW8BpiLG1WtsLnsnUT3WgPnXnGJAhzH2h7Mo+pufpHtI1PXbwX6mS
    mBwjo0GKDA68ZUe35DmZFjcWtMXbcmygbseQAi0VO7e8fRe4QHInM7/
    TuEfOvOvARhGER5MSA0CdHWjTAUThG3jxASIwjhEMCBgBrOLRaixtKxUHuH0gUvGu
    krrU9lRABGhY6622Alzw13KKzvmJAJFhYad0DwnA6Su1QjMzEnX8N+QEscoGg2gQ8Vo
    PUC+zZVIYHrAlSOeg5x7FtKaNY7u25F+QB5mdiKuRGbewJ9BeBdHHLUFqMbtUu7eJ5e
    AFh5QLNKZGzMfE3kmaRs0UiANTrffVB/
    hT84VmlZRwZWq7ly1wBYgCwvpqIbAlzwLi3F0oKPxO2iLe1zsLnkLkC/
    eIQJmeO4p6T6G4rZl2AZAqgDK3iSdtzAMwNUe1zYllFXZB+HvyDmb6TQgyn4PTuXb90l
    B5ak+ZPylixgSl4geRlJwWBJmguIx9NNGcA9m59BKvpDiHUpTRsue4JG41A09ZY4ThyUw
    Ao15sdWPnA5eI392lVbvyhR/
    qIk1PE33VlPYwt8xcfOPAnBO+AFxOiWAtqB+HWxPfbeDcIxTAorrlL5urcnKF5nsOliBp3y
    0ahcWJ/
    L5wDGYT2dvZmzvpna7kDuuYFjWxKJ77Kv8AmIH1i0sQj+6yt4EH6QShwOmNW+8bmzj
    MT67SHGdHaTdZQKbcmQZSPQwDyYNgq4yAE7XX4SR+UThGGqWK1KmewFjlsdueus
    FxnR0s7MKxUE3tl27efbA//9k=">
    <style type="text/css">
    element.style{
    }
    .tengah{
    padding: 40px 20px 20px 20px;
    justify-content: center;
    text-align: center;
    }
    </style>
    </div>
    </body>
    </html>

    \
    2. Tampilan

    You might also like