اضافة البيانات الشخصية رائعة جداً جداً

اضافة البيانات الشخصية رائعة جداً جداً

السلام عليكم ورحمة الله
"
اضافه رائعة للملف الشخصي
صورة لاضافة





قم بدخول الى قوالب > تعديل html
ابحث عن ]]></b:skin>
اضف فوقة مباشرة الكود التالي


@import url(http://fonts.googleapis.com/css?family=Lato:400,700);

::-moz-selection {
    background: rgba(152, 135, 224, 0.88);
    color: #fff;
}

::selection {
    background: rgba(152, 135, 224, 0.88);
    color: #fff;
}

html {
    height: 100%;
}

body, p,
h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

body {
    background: hsl(0, 0%, 96%);  
    background-image: -webkit-radial-gradient(top, circle cover, hsl(0, 0%, 100%), hsl(0, 0%, 94%));
    background-image: -moz-radial-gradient(top, circle cover, hsl(0, 0%, 100%), hsl(0, 0%, 94%));
    background-image: radial-gradient(top, circle cover, hsl(0, 0%, 100%), hsl(0, 0%, 94%));
    background-attachment: fixed;
    font-family: lato, sans-serif;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

    #profile::before {
        display: block;
        height: 144px;
        border-radius: 4px 4px 0 0;
        background: #9591ce;
        -webkit-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.02);
        box-shadow: 0 4px 0 rgba(0, 0, 0, 0.02);
        content: '';
    }

    #profile {
        margin: 40px auto;
        padding-bottom: 38px;
        max-width: 304px;
        border-bottom: 4px solid rgba(0, 0, 0, 0.07);
        border-radius: 4px;
        background: #fff;
        text-align: center;
    }

        #profile > img {
            position: relative;
            top: -52px;
            display: block;
            margin: auto;
            width: 96px;
            height: 96px;
            border: 4px solid white;
            border-radius: 96px;
            -webkit-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.02);
            box-shadow: 0 4px 0 rgba(0, 0, 0, 0.02);
        }
       
       
        #profile h2, #profile p {
            -webkit-user-select: text;
            -moz-user-select: text;
            -ms-user-select: text;
        }

        #profile h2 {
            margin-top: -20px;
            padding: 0 38px 16px 38px;
            color: #77767e;
            font-size: 1.8em;
        }

        #profile p {
            padding: 0 38px;
            color: #9998a0;
            font-size: 1.04em;
            line-height: 1.44em;
        }

        #profile .btn {
            display: inline-block;
            margin: 40px 38px 0 38px;
            padding: 14px 36px;
            border-bottom: 2px solid #7772af;
            border-radius: 2px;
            background: #8783c6;
            color: #fff;
            text-decoration: none;
            cursor: pointer;
            transition: background 80ms, outline 100ms;
        }

/*
            #profile .btn:focus {
                outline: 4px dashed rgba(0, 0, 0, 0.14);
                outline-offset: 2px;
            }
*/

            #profile .btn:hover {
                background: #9591ce;
            }

            #profile .btn:active {
                border-top: 2px solid #6c679d;
                border-bottom: none;
                background: #7370ac;
                -webkit-box-shadow: inset 0 -2px 0 #6c679d;
                box-shadow: inset 0 -2px 0 #6c679d;
            }

 ثاني شي انتقل الى >تخطيط>اضافه اداه>HTML/JavaScript إضافة
ضع الكود التالي وقم بتعديل بياناتك


<aside id="profile">
    <img src="رابط صورتك" />
    <h2>Akram Qahtan</h2>
    <p>مرحبا.. مصمم مواقع , منتديات , مونتاج احب الاطلاع بكل ماهو جديد في عالم التصميم.</p>
    <a class="btn" href="رابط حسابك">اتصل بي!</a>
</aside>


قم بالحفظ ومبروك





You may like these posts