Lấy Mã Màu ,Lấy Linh Ảnh,Chèn Vào Code Css Như Thế NÀo ???? Dành Cho NewBlog

__________Chùm Bài viết Cho NewBlog _________
Dự kiến của mình là hok viết thêm bài viết dành cho các newblogger nữa nhưng tình hình hiện nay là 360  đã đóng cửa blog nên số blog ở bên đó chuyển qua mái nhà Plus của chúng ta sẽ rất nhiều và như vậy sẽ có rất nhiều newbi .Vì lẽ đương nhiên rồi chuyển qua plus giao diện hoàn toàn mới cách thiết kế blog cũng hoàn toàn mới mẻ nên họ  đều là newbi .Chính vì vậy bài viết này tôi sẽ hướng dẫn cơ bản nhất về code css dùng để thiết kế blog cho các bạn .Hy vọng rằng sau bài viết này bạn sẽ vận dụng sáng tạo và áp dụng code và trong blog của mình để blog bạn được đẹp hơn
I_Code Css:
1_Đầu tiên Cùng LÀm Quen Với Khung Css Nhá .Khung này dùng để paste code thiết kế cho blog vô đó mà ban .Css nằm ở đâu hả ??
Àh _bạn click Thiết Kế > Theme .- Chọn Chế Độ Tự Chỉnh Sửa > Tiếp  .

- Bảng Thiết Kế hiện ra, bạn rê chuột kéo thanh trượt đến phần CSS fía dưới nhé !
Phần bên dưới chính là khung Css để dán code vô đó 
Cùng Làm thử Với Bài Làm Trong Suốt Blog Hoàn Toàn Nhá  .Bài viết này bạn chỉ việc copy tất cả code trong bài đó và dán vào Css thôi
Các code khác trong các bài còn lại có yêu cầu thay link ảnh và chèn mã màu thêm vào code , tôi sẽ hướng dẫn sau .Tạm Thời bạn cứ làm thử bài này xem !
2 _Chèn mã màu cho code như thế nào ???
Trong lúc thiết kế chèn code vào css một số code có đòi hỏi chèn thêm mã màu vào code đó để tăng thêm tính thẩm mỹ cho phần  đó .Có rất nhiều bạn hok bít lấy mã màu và hok biết chách chèn mã màu vào code như thế nào .Vì vậy Tôi sẽ hướng dẫn các bạn ngay bây h nhé
Đầu tiên Tôi lấy Ví dụ1 code có chèn thêm mã màu vào nhé
Code thay đổi màu sắc, kích thước các border xung quanh Comment :
.mod-alist-full .alist-comment li {border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-top-style:inset;border-right-style:inset;border-bottom-style:inset;border-left-style:inset;border-top-color:#fff;border-right-color:#fff;border-bottom-color: #fff;border-left-color:#fff;} Hoặc code Thêm viền cho mỗi avatar :
#friendlist_module .rc_bd .rc_bc .hd{height:auto;}
#friendlist_module .rc_bd .rc_bc .bd ul li{border-top:2px dotted #fff;border-right:2px dotted #fff;border-left:2px dotted #fff;}
#friendlist_module .rc_bd .rc_bc .bd ul li:hover{border-top:2px dotted #000;border-right:2px dotted #000;border-left:2px dotted #000;}

_Những chỗ  đánh dấu màu hồng là ký hiệu của mã màu  :#FFF là màu trắng, #000 là màu đen
Đầu tiên bạn cứ copy code vào css  như bình thường  .Muốn lấy mã màu khác cho code  ta chỉ việc làm theo cách sau .Tận dụng bảng màu trên Css Đỡ phải đi đâu xa
Dê chuột vào thanh trượt đến vùng màu mà mình thích
Bôi đen ký hiệu mã màu trong khung đó nhấn copy và thay vào code sau dấu # Ví dụ như#FFF thay lại mã màu của bạn Thành #D10RF9 gì gì đó .
Vậy là bạn đã thay đc mã màu  cho code rồi nhá .
Một số code của Kuhồn có viết #mã_màu bạn cũng làm tương tự vậy
3_Lấy link ảnh , xem kích thước của ảnh như thế nào ???
Đối với 1 số code thay nền thì bắt buộc phải chèn thêm cả link ảnh vào thì code mới có hiệu nghiêm .Mà 1 số bạn cũng hok biết lấy link ảnh như thế nào để thay vào code Tiện đây tôi cũng hướng dẫn luôn
Đầu tiên tôi cũng lấy ví dụ 1 code có bắt buộc phải chèn link nhá và thay chiều cao nhá
Code thay đổi nền toolbar khi soạn thảo phần comments
.rte_toolbar {background:#d7d7d7 url(link Hinh) repeat-x top;border-left:1px solid #0448f6;border-top:1px solid #0448f6;border-right:1px solid #0448f6;height:Xpx;}
_/*thay X = Chiều cao cua hinh*/_
Link ảnh thì tùy bạn chọn cho mình một ảnh nền phù hợp muốn lấy link ta chỉ việc nhấp chuột phải vào hình  chọn
Bảng Properties hiện ra .tại đây hiện thị đường dẫn của ảnh và các thông số chiều cao của ảnh Muốn lấy link ta bôi đen link đó .Chuột phải chọn copy
Khi thay vào code trên ta sẽ đc
.rte_toolbar {background:#d7d7d7 url(http://www.xemanh.net/images/romance/romantic23.jpg) repeat-x top;border-left:1px solid #0448f6;border-top:1px solid #0448f6;border-right:1px solid #0448f6;height:441px;}
Linh ảnh đã đc thay vào code chỗ link Hinh
Xpx đã đc thay bằng đúng kích thước chiều cao thật của hình 441px .từ ví dụ trên mà bạn cũng áp dụng cho các code còn lại như vậy nhá
Lấy thêm ví dụ về code để kết thúc phần này
Code thay nền cho nóc nhà
#blog_masshead{font-size:12px;color:#ccc;background:transparent url(thay link ở đây) repeat-x 0 5px;height:Xpx;}
#blog_masshead a{color:A;text-decoration:blink;}
X : Chiều cao của ảnh ...........
A: Mã Màu Chữ ......
bạn cũng áp dụng như tôi hướng dẫn ở trên
II_Module ;
Di chuyển Module như thế nào ?????
Nhiều bạn hok biết cách di chuyển vị trí của các module sang một vị trí khác .Thực ra thì chuyện này rất đơn giản .đầu tiên bạn kích vào thiết kế _Kéo chuột xuống module cần di chuyển _Nhấp vào giữa thanh tiêu đề ,giữ chuột  và dùng tay kéo và thả nó đến vị trí cần bỏ ,nhớ là khéo tay chút bạn nhá .Đơn giản phải hok nào
Tại sao các Module Phụ của tôi bị rớt ???

 +Khi người xem duyệt blog bằng trình duyệt IE nếu chèn các link ảnh quá to vào module tự tạo phần Module phụ bên phải màn hình sẽ khiến cho các Module này bị rớt xuống
_Đôi khi  bạn chèn một ứng dụng Flash hay 1 video ,1 list nhạc vào Module phụ đó cũng sẽ làm toàn bộ Module bên đó bị rớt . Cách khắc  phục chính là bạn phải biết bố trí các module sao cho phù hợp , chèn hình ảnh ,các ứng dụng phim flash sao cho phù hợp đúng kich thước chiều dài cho module này chỉ nên là 150 thôi

2_Hoặc  bạn để Module bạn bè bên phải cũng sẽ làm toàn bộ module bên này bị rơi xuống cách  khắc phục là bạn nên để nó ở bên trái là tốt nhất để cùng bên với module Profile hoặc có thể để ra module chính
+ Còn đối với Trình duyệt Mozilla Firefox thì mình hok thấy hiện tượng này xảy ra !
Nhưng dù sao bạn cũng nên sắp xếp và bố trí hình ảnh và các module sao cho phù hợp khi người xem blog nào cũng hok thể bị mắc lỗi như trên là tốt nhât
Hy vọng đây là những bài học cơ bản nhất cho các bạn mới thiết kế blog hoặc nó cũng có thể là những mẹo vặt cho bạn trong khi trang trí noc nhà của mình nhá
 bài viết thuộc bản quyền
Vui lòng ghi lại Nguồn nếu sử dụng lại entry này bạn nha !
Chúc Vui !


Nguồn : chúng tôi sưu tầm từ nhiều nguồn

Không có nhận xét nào

Một số lưu ý khi bình luận

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời.

Để bình luận một đoạn code, hãy mã hóa code trước nhé!

» Cảm ơn bạn đã ghé thăm websitemika.com
» Nếu có thắc mắc hay góp ý, bạn hãy để lại một góp ý !
» Vui lòng đăng những góp ý lịch sự và gõ tiếng Việt có dấu nếu có thể
HƯỚNG DẪN ĐĂNG THÔNG TIN GÓP Ý :
Bước 1 – Gõ nội dung bạn cần góp ý tới chúng tôi.
Bước 2 - Xử lý mục " Nhận xét với tư cách "
Cách 1 : - Chọn Tên/URL: Gõ tên và địa chỉ blog bạn vào.Nếu không có tài khoản, bạn vẫn có thể nhận xét bằng cách Chọn hồ sơ là Tên/URL hay Ẩn danh. Tuy nhiên bạn nên chọn Tên/URL với URL có thể để trống để cho chúng tôi biết bạn là ai. Bạn vui lòng gõ tiếng Việt có dấu để mọi người không hiểu nhầm so thành sờ, mo thành mò.
Cách 2 : - Chọn Ẩn danh.
Bước 3 - Xem trước: Tuỳ, Bạn là người cẩn thận cần xem lại nội dung Bạn đã gõ (rất cần nếu Bạn có nhập mã, để xem nó hiển thị có đúng không).
Bước 4 - Nên nháy chuột vào nội dung, bấm phím Ctrol + A rồi Ctrol + C nhằm copy nội dung - Đề phòng lỡ hệ thống đăng góp ý trục trặt hoặc mạng rớt, ta có thể Ctrol + V dán đăng lại góp ý để khỏi tốn thời gian!
Bước 5 – Lick vào Button : Đăng nhận xét . Vậy là xong,góp ý của các bạn sẽ được Admin kiểm duyệt và cho đăng trong vòng 12h.Cảm ơn các bạn đã góp ý !

GIỚI THIỆU ĐẾN QUÝ KHÁCH MỘT SỐ DỰ ÁN SẼ THỰC HIỆN TRONG NĂM 2018


DANH MỤC BÀI ĐĂNG - KHÁCH MUỐN XEM NỘI DUNG GÌ LICK VÀO TIÊU ĐỀ ẤY


WEBSITEMIKA - THƯƠNG HIỆU UY TÍN BỞI HƠN 300 DOANH NGHIỆP VÀ CÁC THƯƠNG HIỆU VỪA VÀ NHỎ LỰA CHỌN
Điểm giao dịch: Online 24h
-Email: Setup247@gmail.com - Website: https://thietkeweb.mikalaza.com