Tạo khung đăng nhập đẹp cho blog

 Khung đăng nhập này được thiết kế kết hợp giữa sử dụng CSS và HTML. Do đó đây là phiên bản Ver2 và được nâng cấp đẹp hơn so với lần trước










CÁC BƯỚC THỰC HIỆN:

1. Đăng nhập Blogger.
2. Vào Thiết Kế => Phần Tử Trang => Thêm Tiện Ích
3. Chọn HTML/Javascript và paste toàn bộ đoạn code sau vào:


<!-- Code by tanchau123.blogspot.com -->
<style>
.khungdangnhap,
.khungdangnhap h1,
.khungdangnhap span,
.khungdangnhap input,
.khungdangnhap label {
margin: 0;
padding: 0;
border: 0;
outline: 0;
}

.khungdangnhap {
position: relative;
width: 260px;
height: 200px;
padding: 15px 25px 0 15px;
//margin-top: 5px;
cursor: default;

background-color: #141517;

-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

-webkit-box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
-moz-box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
box-shadow: 0px 1px 1px 0px rgba(255,255,255, .2), inset 0px 1px 1px 0px rgb(0,0,0);
}


.khungdangnhap h1 {
line-height: 40px;
font-family: 'Myriad Pro', sans-serif;
font-size: 22px;
font-weight: normal;
color: #e4e4e4;
}

.khungdangnhap input[type=text],
.khungdangnhap input[type=password],
.khungdangnhap input[type=submit] {
line-height: 14px;
margin: 10px 0;
padding: 6px 15px;
outline: none;
font-family: Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
text-shadow: 0px 1px 1px rgba(255,255,255, .2);
line-height: 14px;
margin: 10px 0;
padding: 6px 15px;
border: 0;
outline: none;
        background:#4d90fe;
font-family: Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
border-radius: 26px;
        border: 1px solid #3079ED;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}

.khungdangnhap input[type=submit2] {
        color:#FFF;
line-height: 14px;
margin: 10px 0;
padding: 6px 15px;
outline: none;
font-family: Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 14px;
margin: 10px 0;
padding: 6px 15px;
border: 0;
outline: none;
        background:#4d90fe;
font-family: Helvetica, sans-serif;
        text-shadow: 0px 1px 1px rgba(255,255,255, .2);
font-size: 12px;
font-weight: bold;
border-radius: 26px;
        border: 1px solid #3079ED;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;

}

.khungdangnhap input[type=text],
.khungdangnhap input[type=password]
{
color: #686868;
width: 170px;

-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);

background: #989898;
background: -moz-linear-gradient(top,  #ffffff 0%, #989898 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#989898));
background: -webkit-linear-gradient(top,  #ffffff 0%,#989898 100%);
background: -o-linear-gradient(top,  #ffffff 0%,#989898 100%);
background: -ms-linear-gradient(top,  #ffffff 0%,#989898 100%);
background: linear-gradient(top,  #ffffff 0%,#989898 100%);
}

.khungdangnhap input[type=text]:hover,
.khungdangnhap input[type=password]:hover {
-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
}

.khungdangnhap input[type=text]:focus,
.khungdangnhap input[type=password]:focus {
background: #e1e1e1;
background: -moz-linear-gradient(top,  #ffffff 0%, #e1e1e1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e1e1e1));
background: -webkit-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
background: -o-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
background: -ms-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
background: linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
}

.khungdangnhap input[type=submit]
{
cursor: pointer;
color: #445b0f;
height: 28px;
line-height:0;
color: #DDD;
background: #4d90fe;
border: 1px solid #3079ED;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}

.khungdangnhap input[type=submit2]
{
cursor: pointer;
color: #DDD;
height: 15px;
        width: 60px;
        text-align:center;
line-height:0;
color: #DDD;
background: #F90;
border: 1px solid #FFD700;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}

.khungdangnhap input[type=submit]:hover {
background:#357AE8;
        border: 1px solid #2F5BB7;
        text-shadow:0 0 3px #FFF !important;
}

.khungdangnhap input[type=submit2]:hover {
background:#F60;
        border: 1px solid #2F5BB7;
        text-shadow:0 0 3px #FFF !important;
}

.khungdangnhap input[type=submit]:active {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
</style>
<div class="khungdangnhap">

<center>
<strong style="color:white;text-shadow:0 0 3px #FFF !important;">LOGIN FORM</strong>
<form action='https://www.google.com/accounts/ServiceLogin?service=blogger&amp;continue=https%3A%2F%2Fwww.blogger.com%2Floginz%3Fd%3Dhttp%253A%252F%252Fwww.blogger.com%252Fhome%26a%3DADD_SERVICE_FLAG&amp;passive=true&amp;alinsu=0&amp;aplinsu=0&amp;alwf=true&amp;ltmpl=start&amp;skipvpage=true&amp;rm=false&amp;showra=1&amp;fpui=2&amp;naui=8#s01' method='post'>
<input type="text" name="username" placeholder="Your Gmail" />
<input type="password" name="password" placeholder="Password" />
<input type="submit" value="Đăng nhập" /> <a href='https://www.blogger.com/signup.g' target='_blank'><input type="submit2" value="Đăng ký" /></a>

</form>
</center>
</div>
<!-- Code by tanchau123.blogspot.com -->
theo tanchau123.blogspot.com
Sưu tầm bởi : www.meovatcuocsong.blogspot.com

Comments

Post a Comment

Popular posts from this blog

Tự làm mỳ hình chiếc nơ không cần máy

Image
Có nhiều tỉ lệ trứng với bột khác nhau, tùy nơi làm, nhưng chúng tôi khuyên bạn dùng 1 quả trứng với ½ cup bột mỳ. - Bạn đổ bột mỳ thành đống hình núi. - Sau đó làm một hố như hình núi lửa rồi đập trứng vào. - Rắc lên chút muối và dùng dĩa quấy nhẹ trứng, từ từ đánh bột mỳ xung quanh vào. - Một khi hỗn hợp bột bắt đầu sền sệt thì bạn có thể dùng tay để nhào cho kỹ hơn. Bạn có thể cần cho thêm chút nước nếu bột khô quá. Khi bột đã thực sự nhuyễn, bạn nặn thành quả bóng và dùng nilon thực phẩm bọc lại rồi để khoảng nửa tiếng. Bột sẽ được nghỉ và dễ thao tác hơn sau đó. - Cắt quả bóng thành đôi hoặc thành tư, bắt đầu dùng chày cán mỏng từng phần một, cố gắng cán thành hình chữ nhật và thật mỏng. Sau đó, bạn dùng dao sắc cắt thành các hình chữ nhật nhỏ 4x2,5cm. Bạn bóp ở trung điểm 2 chiều dài vào với nhau để tạo thành hình cái nơ. Xem bài viết đầy đủ
Read more

Thưởng thức bánh ngon 3 miền mùa thu

Image
Trong không khí mát mẻ của mùa thu, với những cơn mưa bất chợt vào buổi chiều se lạnh, được thưởng thức những loại bánh nóng hổi, giòn tan như bánh xèo, bánh đúc, bánh chuối hấp... thật sự hấp dẫn. Bánh xèo là món ăn đặc trưng của miền Trung và Nam bộ. Để có được chiếc bánh xèo giòn tan thì khâu pha bột là rất quan trọng. Với cách làm bánh xèo này, bạn nên cho thêm chút bia khi pha bột để bánh giòn lâu hơn và lúc pha bột xong bạn nên để bột ngấm đủ nước, thi thoảng khuấy đều để bột không bị lắng xuống dưới. Bánh xèo miền Trung tuy không có mầu vàng tươi của bột nghệ nhưng vẫn rất hấp dẫn bởi màu trắng đục của bột gạo, với những con tôm đỏ tươi bên trong thật hấp dẫn. Không chỉ thơm ngon, nóng hổi, bánh xèo miền Trung còn chinh phục người ăn bởi sự phong phú của nước chấm. Ngoài chén nước chấm chua ngọt như cách ăn của người miền Nam, còn có chén nước chấm mắm nêm được pha đậm đà, vừa ăn hay chén nước chấm pha với đậu phụng thơm ngon và có vị hơi béo. Chiếc bánh nhỏ, nóng hổi và giòn rụ
Read more

Cùng Linh Tây đón Giáng sinh tại Doha cafe

Image
Nằm nổi bật ở ngõ 178 Thái Hà, Doha cafe – Cái tên gắn gọn dễ đọc dễ nhớ. Tên quán được thiết kế theo kiểu nửa vòng tròn và một vòng tròn với ý nghĩa tượng trưng cho sự “tròn vị” trong cả đồ ăn lẫn đồ uống. Nó là sự hòa trộn của các vị cay, chua, mặn, ngọt. Ngoài ra, chính màu sắc của tên quán cũng tượng trưng cho điều này. Vị cay là đỏ, xanh là chua, mặn là trắng và ngọt là vàng. Tên quán được thiết kế theo kiểu nửa vòng tròn và một vòng tròn với ý nghĩa tượng trưng cho sự “tròn vị” trong cả đồ ăn lẫn đồ uống. Nó là sự hòa trộn của các vị cay, chua, mặn, ngọt. Ngoài ra, chính màu sắc của tên quán cũng tượng trưng cho điều này. Vị cay là đỏ, xanh là chua, mặn là trắng và ngọt là vàng. Không gian ở quán nhỏ xinh, đơn giản nhưng vẫn toát lên được sự sang trọng, lịch sự, ấm cúng. Đặc biệt bên cạnh những đồ uống quen thuộc và cả cocktail, mocktail thì  menu đồ ăn cực kỳ phong phú mà giá cả lại rất phải chăng cho teen chúng mình nhé. Linh tây cực kì nghiện món pizza hải sản và soup hải sản
Read more