About me 2
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta charset='UTF-8'/>
<title>About Me</title>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<link crossorigin='anonymous' href='https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css' integrity='sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm' rel='stylesheet'/>
<link href='//code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css' rel='stylesheet'/>
<link href='sheet/mine.css' rel='stylesheet'/>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,700' rel='stylesheet'/>
<script src='javascript/myscript.js'/>
<b:skin><![CDATA[
* {
font-family: 'Open Sans', sans-serif;
}
a:hover {
text-decoration: none;
}
.name p:nth-child(2) {
color: #575757d1;
font-family: 'roboto', sans-serif;
font-weight: 400;
margin-top: 5px;
letter-spacing: 0.6px;
}
body {background-color: #f9f9f9; margin:0; padding:0;}
.avatarBox img {
box-shadow: 0px 0px 4px 1px #373141ab;
}
.menu h3 {
color: #76cc9c;
}
.name {
cursor: default;
}
.name .s {
text-shadow: 0.6px 0.6px 2px #3cb3716e;
}
.name p:first-child {
font-weight: 700;
color: #585858;
font-size: 24pt;
padding-bottom: 0px;
margin-bottom: 0px;
line-height: 1;
margin-top: 6px;
transition: 0.4s;
box-sizing: border-box;
padding-bottom: 5px;
padding-right: 10px;
display: inline-block;
position: relative;
}
.name p:first-child:after {
content: '';
top: 0;
position: absolute;
height: 100%;
width: 4px;
background-color: orange;
transition: 0.2s;
margin-left: 10px;
transform-origin: 50% 50%;
transform: scaleY(0);
}
.name p:first-child:hover:after {
transform: scaleY(1);
}
.name p:first-child span {
font-weight: 300;
}
.s {
display: inline-block;
margin: 0 0 0 12px;
transform: scaleX(0);
transform-origin: 0% 50%;
transition: 0.3s;
}
.s span {
font-size: 18px;
}
.name p:nth-child(3) {
text-shadow: 0.2px 0.2px 0.4px #44227bd1;
}
.name p:nth-child(3) span{
font-size: 18px;
margin-right: 4px;
}
.menu h3 span {
color: #e4664f;
}
.menu {
background-color: #f3f3f3;
width: 100%;
top: 0;
position: fixed;
z-index: 100;
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.2);
}
.boldd {
font-weight: 600;
color: #5a5a5af2;
}
.menuMore {
}
.b {
text-shadow: 0px 0px 0.2px #44227bd1;
font-size: 12pt;
}
.profile {
background-color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.sayHi {
background-color: #f16a52;
display: inline-block;
font-weight: 600;
letter-spacing: 0.6px;
padding: 5px 7px;
line-height: 1.3;
font-size: 17px;
text-transform: uppercase;
color: #fff;
border-radius: 2px;
position: relative;
}
.sayHi:after {
content: '';
width: 0;
height: 0;
top: 100%;
left: 10px;
display: block;
position: absolute;
border-style: solid;
border-width: 0 0 8px 8px;
border-left-color: #f16a52;
}
.social span {
color: #f1eeee;
display: inline-block;
font-size: 24px;
margin-bottom: 14px;
line-height: 1.1;
transition: 0.4s;
}
.social span:hover {
color: #373737;
}
.social span {
padding-top: 16px;
list-style-type: none;
}
.detailInfo {
color: #373737;
}
.license a {
font-size: 13px;
color: #6fb9a475;
}
]]></b:skin>
</head>
<!-- Bắt đầu phần hiển thị trên web -->
<body>
<div class='menu'>
<div class='container'>
<div class='row'>
<div class='col-12 text-center'>
<h3 class='py-3'>About <span>Me</span></h3>
</div>
</div>
</div>
</div>
<div class='container' style='margin-top: 116px;'>
<div class='row'>
<div class='col-11 mx-auto profile'>
<div class='py-3 px-2 px-lg-4 py-lg-5'>
<div class='row'>
<div class='avatarBox col-12 col-lg-5'>
<img class='img-fluid' src='https://imgur.com/CXP6VAC.png'/>
</div>
<div class='infoBox col-12 col-lg-6 mt-2 mt-lg-0'>
<p class='sayHi'>Hello</p>
<div class='name'>
<p><span>Tôi là</span> Khôi Ròm</p>
<p class='s'>Baby I'm real
<span class='ion-ios-checkmark-outline'/>
</p>
<p><span class='ion-android-globe'/> KhoiRomBlog.Site</p>
</div>
<hr/>
<div class='detailInfo'>
<div class='row my-2'>
<div class='col-lg-4 col-12 boldd'>Tên</div>
<div class='col-lg-8 col-12 b'>Khôi Ròm</div>
</div>
<div class='row my-2'>
<div class='col-lg-4 col-12 boldd'>Công ty</div>
<div class='col-lg-8 col-12 b'>Trách nhiệm hữu hạn 0 thành viên</div>
</div>
<div class='row my-2'>
<div class='col-lg-4 col-12 boldd'>Nghề nghiệp</div>
<div class='col-lg-8 col-12 b'>Chém gió thuê</div>
</div>
<div class='row'>
<div class='col-lg-4 col-12 boldd'>Tuổi</div>
<div class='col-lg-8 col-12 b'>17</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class='col-11 mx-auto bg-danger contact text-center'>
<div class='social col-12'>
<!-- Facebook -->
<a href='https://facebook.com/mkhoi2001' target='_blank'>
<span class='ion-social-facebook mr-4 mr-lg-5'/>
</a>
<span class='ion-social-instagram-outline mr-4 mr-lg-5 ml-lg-3'/>
<span class='ion-social-whatsapp-outline mr-4 mr-lg-5 ml-lg-3'/>
<span class='ion-social-skype-outline mr-4 mr-lg-5 ml-lg-3'/>
<span class='ion-social-twitter-outline mr-4 mr-lg-5 ml-lg-3'/>
<span class='ion-social-linkedin-outline ml-lg-3'/>
</div>
</div>
</div>
</div>
<footer>
<div class='container-fluid mt-2'>
<div class='row'>
<div class='col-11 text-right'>
<p class='license mr-lg-4 mr-0'>
<a href='https://www.khoiromblog.site'/>
</p>
</div>
</div>
</div>
</footer>
<b:section class='krb' id='navbar' maxwidgets='1' showaddelement='yes'/>
<script type='text/javascript'>
//<![CDATA[
var _0x316c=["\x44\x4F\x4D\x43\x6F\x6E\x74\x65\x6E\x74\x4C\x6F\x61\x64\x65\x64","\x2E\x6D\x65\x6E\x75","\x71\x75\x65\x72\x79\x53\x65\x6C\x65\x63\x74\x6F\x72","\x6E\x6F","\x73\x63\x72\x6F\x6C\x6C","\x70\x61\x67\x65\x59\x4F\x66\x66\x73\x65\x74","\x6D\x65\x6E\x75\x4D\x6F\x72\x65","\x61\x64\x64","\x63\x6C\x61\x73\x73\x4C\x69\x73\x74","\x79\x65\x73","\x72\x65\x6D\x6F\x76\x65","\x61\x64\x64\x45\x76\x65\x6E\x74\x4C\x69\x73\x74\x65\x6E\x65\x72","\x2E\x6E\x61\x6D\x65\x20\x70","\x2E\x6E\x61\x6D\x65\x20\x2E\x73","\x6D\x6F\x75\x73\x65\x65\x6E\x74\x65\x72","\x74\x72\x61\x6E\x73\x66\x6F\x72\x6D","\x73\x74\x79\x6C\x65","\x73\x63\x61\x6C\x65\x58\x28\x31\x29","\x63\x6F\x6C\x6F\x72","\x6D\x65\x64\x69\x75\x6D\x73\x65\x61\x67\x72\x65\x65\x6E","\x6D\x6F\x75\x73\x65\x6C\x65\x61\x76\x65","\x73\x63\x61\x6C\x65\x58\x28\x30\x29","\x2E\x6C\x69\x63\x65\x6E\x73\x65\x20\x61","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x50\x6F\x77\x65\x72\x65\x64\x20\x42\x79\x20\x4B\x68\xF4\x69\x20\x52\xF2\x6D\x20\x2D\x20\x4B\x68\x6F\x69\x52\x6F\x6D\x42\x6C\x6F\x67\x2E\x53\x69\x74\x65"];document[_0x316c[11]](_0x316c[0],function(){var _0x3457x1=document[_0x316c[2]](_0x316c[1]);var _0x3457x2=_0x316c[3];window[_0x316c[11]](_0x316c[4],function(){if(window[_0x316c[5]]> 65&& _0x3457x2== _0x316c[3]){_0x3457x1[_0x316c[8]][_0x316c[7]](_0x316c[6]);_0x3457x2= _0x316c[9]}else {if(_0x3457x2= _0x316c[9]&& 65 >= window[_0x316c[5]]){_0x3457x1[_0x316c[8]][_0x316c[10]](_0x316c[6]);_0x3457x2= _0x316c[3]}}});var _0x3457x3=document[_0x316c[2]](_0x316c[12]),_0x3457x4=document[_0x316c[2]](_0x316c[13]);_0x3457x3[_0x316c[11]](_0x316c[14],function(){_0x3457x4[_0x316c[16]][_0x316c[15]]= _0x316c[17];_0x3457x4[_0x316c[16]][_0x316c[18]]= _0x316c[19]});_0x3457x3[_0x316c[11]](_0x316c[20],function(){_0x3457x4[_0x316c[16]][_0x316c[15]]= _0x316c[21]});var _0x3457x5=document[_0x316c[2]](_0x316c[22]);_0x3457x5[_0x316c[23]]= _0x316c[24]},false);
</script>
</body>
</html>
Public Last updated: 2018-05-04 02:49:50 AM
