• Network
  • Security
  • Software
  • Thủ thuật
  • Tin tức
  • Video hướng dẫn
  • Donate – Mời AnonyViet ly Cafe ☕
AnonyViet
  • Tin tức
  • Network
    • Mạng cơ bản
    • Hyper-V
    • Linux
    • Windown Server 2012
  • Security
    • Basic Hacking
    • Deface
    • Kali Linux / Parrot
    • SQL Injection
  • Thủ thuật
    • Khóa Học Miễn Phí
    • Code
    • Mẹo Vặt Máy Tính
    • Facebook
    • Windows 7/8/10/11
    • Đồ Họa
    • Video
  • Software
    • Phần mềm máy tính
    • Phần mềm điện thoại
  • Tin học văn phòng
  • Kiến thức
  • MMO
    • Advertisers – Publishers
    • Affiliate Program
    • Kiếm tiền bằng điện thoại
    • Pay Per Click – PPC
No Result
View All Result
  • Tin tức
  • Network
    • Mạng cơ bản
    • Hyper-V
    • Linux
    • Windown Server 2012
  • Security
    • Basic Hacking
    • Deface
    • Kali Linux / Parrot
    • SQL Injection
  • Thủ thuật
    • Khóa Học Miễn Phí
    • Code
    • Mẹo Vặt Máy Tính
    • Facebook
    • Windows 7/8/10/11
    • Đồ Họa
    • Video
  • Software
    • Phần mềm máy tính
    • Phần mềm điện thoại
  • Tin học văn phòng
  • Kiến thức
  • MMO
    • Advertisers – Publishers
    • Affiliate Program
    • Kiếm tiền bằng điện thoại
    • Pay Per Click – PPC
No Result
View All Result
AnonyViet
No Result
View All Result

Share miễn phí bộ Code web Profile Page cực đẹp

Lmint by Lmint
in Code
Reading Time: 6 mins read
A A
10

Mục lục bài viết

  1. Giới thiệu về Profile Page
  2. Trang Profile này có gì đặc biệt ?
    1. Hiển thị trên máy tính
    2. Hiển thị trên di động
    3. Tương thích cả trên Ipad
  3. Video demo
    1. Lưu ý
  4. Hướng dẫn chỉnh sửa Source Profile Web page
    1. Hướng dẫn chỉnh sửa code web
    2. Mở file index.html
    3. Chỉnh sửa hình ảnh

Sau thành công của tác phẩm code Web tỏ tình 2018. Hôm nay, mình đã làm thêm một trang Profile theo yêu cầu của member. Mình vẫn dùng BS4, Angular Js, Javascript, HTML5 và CSS3 quen thuộc để viết.

Tham gia kênh Telegram của AnonyViet  👉 Link 👈

Code website tỏ tình 2018

Các bài viết liên quan

Cách tạo Web App Chatbot viết code tự động bằng Python 7

Cách tạo Web App Chatbot viết code tự động bằng Python

20/03/2023
Tạo Fake Link và ảnh bài viết Facebook để Troll bạn bè 8

Tạo Fake Link và ảnh bài viết Facebook để Troll bạn bè

09/03/2023
chon chung chi ssl phu hop website cua ban

Chứng chỉ SSL nào phù hợp với Website của bạn?

06/03/2023
cach tao hinh ascii Duc Phat khi nhan F12

ASCII Đức Phật phù hộ Code không Bug

13/02/2023

Giới thiệu về Profile Page

Là trang giới thiệu bản thân và hiển thị thông tin liêc lạc đến người khác thông qua trang website. Bất cứ ai cũng muốn giới thiệu bản thân đến bạn bè, đồng nghiệp hoặc đối tác một cách chu đáo, chuyên nghiệp và ấn tượng.

Do đó, nếu bạn sở hữu một trang Profile độc đáo thì người khác sẽ ấn tượng và đánh giá cao về bạn. Cho thấy bạn là một đối tác khá chuyên nghiệp và đáng tin tưởng. Thử hỏi nếu bạn làm một trang giới thiệu bản thân sơ xài thì người ta có dám đặt niềm tin ?

Trang Profile này có gì đặc biệt ?

Trang được áp dụng Bootstrap 4 và Angular Js nhiều. Đảm bảo hỗ trợ tốt việc hiển thị đa nền tảng – tương thích mọi thiết bị kể cả di động. Do đó, sẽ tăng tính thân thiện của website và mang đến cảm giác chuyên nghiệp.

Hiển thị trên máy tính

share miễn phí code web profile

 

Hiển thị trên di động

share miễn phí code web profile

Tương thích cả trên Ipad

share miễn phí code web profile

Giao diện và bố cục được mình dành nhiều thời gian sắp xếp cẩn thận. Màu sắc và Icons được mình chọn lựa rất kĩ càng. Mang lại cảm giác thiết kế Material, hiện đại và chuyên nghiệp hơn.

Ngoài ra, những hiệu ứng Scroll Action, Draw vector được áp dụng phù hợp tạo nên các chuyển động nhẹ nhàng. Không gây khó chịu cho người dùng.

Video demo

Trên đây là video trải nghiệm thực tế sau khi đã upload lên host của mình. Bây giờ, mình sẽ hướng dẫn bạn cách chỉnh sửa code của mình ngay tại phần dưới đây.

Lưu ý

Do lần trước một số bạn có lấy code của mình đi share và đem đi buôn bán, kinh doanh. Cho nên lần này mình sẽ nén code lại và dùng Angular JS để binding dữ liệu. Việc này sẽ làm trục trặc việc hiển thị lúc đầu một tí nhưng không ảnh hưởng nhiều.

09-03-2018-09-16-0109-03-2018-09-16-01
09-03-2018-10-13-0809-03-2018-10-13-08
09-03-2018-10-13-4309-03-2018-10-13-43

Hướng dẫn chỉnh sửa Source Profile Web page

Trước khi chỉnh sửa code web thì mình mong các bạn có thể đáp ứng được các yêu cầu cần thiết dưới đây.

  • Chuẩn bị một phần mềm chỉnh sửa code web cần thiết – mình dùng Sublime Text 3.
  • Biết cách dùng Ctrl + F để tìm kiếm code web.
  • Có kiến thức cơ bản về HTML.
  • Biết phân biệt ảnh .jpg và .png.

Hướng dẫn chỉnh sửa code web

Đầu tiên bạn tải về và giải nén ra (extract) sẽ thấy được đống file như ảnh dưới đây. Ai có thắc mắc hãy liên hệ mình qua Facebook fb.com/minhthong.lu.58

share miễn phí code web profile

  • img: thư mục chứa hình ảnh sử dụng trong website.
  • Javascript: thư mục chứa toàn bộ code Javascript của website.
  • index.html: Trang hiển thị của website.
  • main.css: file chứa code css của website.

Bạn vào thư mục Javascript và mở file nlar.js bằngchương trình chỉnh sửa code. Đây là file chứa code web Angular js và toàn bộ nội dung chữ hiển thị trên website.

share miễn phí code web profile

Rất cả nội dung chữ hiển thị trên trang web mình viết tại đây. Bạn sẽ chỉnh nội dung trong ngoặc kép “” thành nội dung mà bạn muốn.

Mở file index.html

Tuy nhiên vì tên Lư Minh Thông mình phải Charming chữ ra để làm hiệu ứng. Nên nếu muốn thay đổi thì bạn phải vào index.html mà chỉnh.

Ctrl + F để tìm chữ Lư Minh Thông và đổi thành tên của bạn.

Share miễn phí bộ Code web Profile Page cực đẹp 5

Chỉnh sửa hình ảnh

Trong thư mục img mình có để hai ảnh story1.jpg và story2.png để làm hai ảnh bài viết trên website.

Share miễn phí bộ Code web Profile Page cực đẹp 6

Bạn tải ảnh mà bạn thích và lưu trong thư mục img. Sau đó, vào file index.html và ấn Ctrl + F rồi tìm như cách trên nhé. Sau đó sửa tên ảnh thành ảnh mà bạn muốn.

Download

Nhớ bỏ qua quảng cáo để ủng hộ mình nhé !

Lưu ý: nếu Upload lên host bị lỗi không chạy được, hãy đổi tên thư mục Javascript thành javascript (chữ j viết thường).

Vậy là xong. Ngoài ra hi vọng bạn không thay đổi bất cứ gì thêm để tránh hư code, hỏng code. Nếu có thắc mắc hãy liên hệ mình tại facebook: fb.com/minhthong.lu.58

Chúc bạn thành công
Lmint.

Bài viết đạt: 5/5 - (100 bình chọn)
Tags: bootstrapcá nhânchỉnh codecodecssFacebookhọchtmlhướng dẫnjavascriptlập trìnhmiễn phíprofileshare codewebWebsitewebste
Lmint

Lmint

Người mà bạn nên trông đợi, chỉ có bản thân bạn mà thôi. Đừng phụ thuộc quá nhiều vào người khác để đến khi nhìn lại bản thân thì chẳng làm được gì nên trò.

Related Posts

Hướng dẫn tự tạo Bot ChatGPT trên Telegram 9
Python

Hướng dẫn tự tạo Bot ChatGPT trên Telegram

27/03/2023
Cách tạo Web App Chatbot viết code tự động bằng Python 10
Code

Cách tạo Web App Chatbot viết code tự động bằng Python

20/03/2023
Cách vượt Captcha Google bằng python 11
Python

Cách vượt Captcha Google bằng python

23/02/2023
cach tao hinh ascii Duc Phat khi nhan F12
Code

ASCII Đức Phật phù hộ Code không Bug

13/02/2023
code cay thong noel python
Code

Code cây thông Noel bằng Python – Merry Christmas Python

24/12/2022
Tự tạo Chatbot ChatGPT bằng Python cho riêng mình 12
Code

Tự tạo Chatbot ChatGPT bằng Python cho riêng mình

19/12/2022
Next Post
Mẹo sử dụng phần mềm Internet Download Manager hiệu quả 13

Mẹo sử dụng phần mềm Internet Download Manager hiệu quả

guest

guest

Website này sử dụng Akismet để hạn chế spam. Tìm hiểu bình luận của bạn được duyệt như thế nào.

10 Comments
oldest
newest
Inline Feedbacks
View all comments
alo
alo
5 years ago

sao đổi đc fb ở web tỏ tình z ad

Reply
Lmint
Author
Lmint
5 years ago
Reply to  alo

bạn học kiến thức cơ bản về thẻ liên kết < a src=" " >trong html đi rùi biết chỉnh nhén.

Reply
vương
vương
5 years ago
Reply to  alo

liên hệ mình hướng dẫn cho, tuy mình ko giỏi, nhưng có bk chút chút fb.com/1710.super ….nhân tiện cảm ơn ad vì code thông tin , em đã dùng và rất cảm ơn ạ.

Reply
Lewe-2k6
Lewe-2k6
5 years ago

tks Ad nhieu lam a. ^^

Reply
katori
katori
4 years ago

tên đoạn nhạc trong video là gì vậy ạ?

Reply
namdaik
namdaik
4 years ago

mấy template này mình thấy bình thường quá

Reply
Bmacf
Bmacf
4 years ago

Lỗi. Code này nó bị gì á anh ơi, e up lên host nó bị lỗi nó ra mấy cái {…} gì đó. A hãy sửa lại và gửi giúp e vào : [email protected]

Reply
AnonyViet
Admin
AnonyViet
4 years ago
Reply to  Bmacf

bạn chụp hình lỗi lên xem

Reply
Nguyễn Tài
Nguyễn Tài
1 year ago

code giờ xài vẫn chất

Reply
Giang
Giang
4 months ago

bạn còn lưu source Profile viết bằng HTML CSS JS ko cho mình xin mình demo với ạ

Reply
wpdiscuz   wpDiscuz

Asia 300×600

Liên hệ Quảng Cáo

Lien he AnonyViet

Đối tác —

Fshare

Các bài mới

Mẹo tạo ra nhiều món lẩu hấp dẫn trong game Tiệm lẩu Đường Hạnh Phúc 14

Mẹo tạo ra nhiều món lẩu hấp dẫn trong game Tiệm lẩu Đường Hạnh Phúc

29/03/2023
Hướng dẫn đăng ký CCCD online ngay tại nhà 15

Hướng dẫn đăng ký CCCD online ngay tại nhà

29/03/2023
Cách chia sẻ file giữa Android/iOS và máy tính không cần phần mềm 16

Cách chia sẻ file giữa Android/iOS và máy tính không cần phần mềm

28/03/2023
Hướng dẫn tự tạo Bot ChatGPT trên Telegram 17

Hướng dẫn tự tạo Bot ChatGPT trên Telegram

27/03/2023
Cách sử dụng ChatGPT-4 miễn phí trên Chrome và FireFox 18

Cách sử dụng ChatGPT-4 miễn phí trên Chrome và FireFox

27/03/2023

Ads

Giới thiệu

AnonyViet

AnonyViet

Nơi chia sẻ những kiến thức mà bạn chưa từng được học trên ghế nhà trường!

Chúng tôi sẵn sàng đón những ý kiến đóng góp, cũng như bài viết của các bạn gửi đến AnonyViet.

Hãy cùng AnonyViet xây dựng một cộng đồng CNTT lớn mạnh nhất!

Giới thiệu

AnonyViet là Website chia sẻ miễn phí tất cả các kiến thức về công nghệ thông tin. AnonyViet cung cấp mọi giải pháp về mạng máy tính, phần mềm, đồ họa và MMO.

Liên hệ

Email: anonyviet.com[@]gmail.com

1409 Hill Street #01-01A
Old Hill Street Police Station
Singapore 179369

 

Bản quyền: DMCA.com Protection Status

Phản hồi gần đây

  • Duy trong Cách sử dụng ChatGPT-4 miễn phí trên Chrome và FireFox
  • Yuuta trong Cách dùng AI của DALL-E 2 để tạo hình ảnh theo ý bạn
  • Clemo trong Download Driver Booster 10 Pro Full Key – Tải và cập nhật Driver tự động
  • AnonyViet trong Cách nâng cấp Google One 100GB giá chỉ 7000đ/tháng
  • Demon trong Cách đăng ký và sử dụng Google Bard – AI của Google
https://shbet8.org

©2023 AnonyViet - Chúng tôi mang đến cho bạn những kiến thức bổ ích về Công nghệ. Google Bing Github Github stackoverflow Youtube wikipedia reddit iwinclublink.app tải game iwin tải iwin apk tải tdtc w88 top tải win456 iwin888 ku11net.co ku fun twin F8BET https://new8869.com https://okuytin.com hi 88

No Result
View All Result
  • Tin tức
  • Network
    • Mạng cơ bản
    • Hyper-V
    • Linux
    • Windown Server 2012
  • Security
    • Basic Hacking
    • Deface
    • Kali Linux / Parrot
    • SQL Injection
  • Thủ thuật
    • Khóa Học Miễn Phí
    • Code
    • Mẹo Vặt Máy Tính
    • Facebook
    • Windows 7/8/10/11
    • Đồ Họa
    • Video
  • Software
    • Phần mềm máy tính
    • Phần mềm điện thoại
  • Tin học văn phòng
  • Kiến thức
  • MMO
    • Advertisers – Publishers
    • Affiliate Program
    • Kiếm tiền bằng điện thoại
    • Pay Per Click – PPC

©2023 AnonyViet - Chúng tôi mang đến cho bạn những kiến thức bổ ích về Công nghệ. Google Bing Github Github stackoverflow Youtube wikipedia reddit iwinclublink.app tải game iwin tải iwin apk tải tdtc w88 top tải win456 iwin888 ku11net.co ku fun twin F8BET https://new8869.com https://okuytin.com hi 88

wpDiscuz
!

Ads

Ads Blocker Detected!!! - Vui lòng tắt Ad Blocker!!!

Vui lòng tắt Ad Blocker

Có vẻ như bạn đang bật trình chặn Quảng cáo.

{Trường hợp bạn đang dùng trình duyệt từ Facebook, hãy copy link bài viết qua Chrome để xem nội dung, như vậy sẽ không bị chặn}

Website chúng tôi duy trì nhờ vào doanh thu quảng cáo, vì vậy hãy tắt trình chặn quảng cáo để chúng tôi có kinh phí chi trả tiền thuê Server, xin cảm ơn!

I've disable Adblock - Tôi đã tắt Adblock