Creative Web Typography Styles


Trong hướng dẫn này chúng tôi sẽ tạo ra những phong cách typography web khác nhau bằng cách sử dụng các plugin jQuery lettering.js và kỹ thuật CSS khác nhau. Đối với một số ví dụ, chúng tôi cũng sẽ thêm di chuột quá trình chuyển đổi để làm những điều một chút tương tác nhiều hơn.

Mẫu 1


Ý tưởng của ví dụ đầu tiên là để tách hoặc cắt một từ khi bay bổng và làm cho một từ khác xuất hiện trong khoảng cách. Cho rằng chúng tôi sẽ cần một cấu trúc đặc biệt.


<h2 class="cs-text">
<span class="cs-text-cut">
Smooth
</span>
 
<span class="cs-text-mid">
Operator
</span>
 
<span class="cs-text-cut">
Smooth
</span>
</h2>



Từ đó sẽ được hiển thị ban đầu, sẽ được nhân đôi. (Lưu ý rằng tất cả các ví dụ này dành cho các mục đích trang trí và có thể không được 'SEO friendly'.)
Chúng tôi sẽ áp dụng các plugin lettering.js cho các từ có nghĩa rằng chúng ta sẽ có một khoảng thời gian xung quanh từ đầu tiên và cuối cùng (bản sao):

$(".cs-text-cut").lettering('words');



Bây giờ, chúng ta hãy xem css. Trước hết chúng tôi sẽ thiết lập chiều rộng và chiều dài :

.cs-text {
width: 645px;
margin: 120px auto 30px;
cursor: default;}



Đặt thiết lập mặc định của thẻ span là block:


.cs-text > span
{ display: block;}

BẠN SẼ QUAN TÂM

5 Website nhắn tin SMS miễn phí tới điện thoại

Tiêu điểm 17-10-2013, 06:57

Hiện nay nhắn tin SMS trở nên quá phổ biến và không thể thiếu đối với chúng ta. Mỗi ngày chúng ta sẽ phải tri ra hàng.

Google cập nhật thuật toán tìm kiếm Hummingbird

Công nghệ 28-09-2013, 15:15

Google cập nhật thuật toán tìm kiếm mới, hệ thống nó sử dụng để sắp xếp thông qua tất cả các thông tin mà nó giúp bạn.

Cập nhật IOS 7 Beta 3 dành cho Developers

Công nghệ / Điện thoại 9-07-2013, 19:31

Apple vừa phát hành bản iOS 7 beta 3 nhằm khắc phục lỗi và bổ sung một số tính năng mới cho người dùng iOS. Với những.

Khởi động trực tiếp vào Desktop trong Windows 8.1

Thủ thuật / Hệ điều hành 9-07-2013, 11:14

Rất nhiều người muốn loại bỏ màn khởi động mặc định trên Windows 8, đăng nhập trực tiếp vào giao diện desktop. Với.

Tin tặc thừa nhận cuộc tấn công vào Stratfor

Công nghệ 30-05-2013, 00:39

Một người đàn ông gốc Mỹ 28 tuổi có thể đối mặt với 10 năm tù giam sau khi nhận tội về cuộc tấn công vào công ty tình.

Bộ Thông tin và Truyền thông lấy ý kiến dân

Công nghệ 16-05-2013, 19:00

(TCN) -Để triển khai các thủ tục xét trình phong tặng danh hiệu Chiến sĩ thi đua toàn quốc giai đoạn 2007 – 2012 cho.

Khoảng 8 năm nữa sẽ có xe ô tô bay

Công nghệ 11-05-2013, 22:29

Terrafugia là một công ty thuộc bang Massachusetts, nước Mỹ. Terrafugia (nổi tiếng trong việc sản xuất các thiết bị.

Amazon sẽ có Kindle Fire 10 inch

Công nghệ / Máy tính bảng 4-05-2013, 23:22

Amazon dự định sẽ có Kindle Fire với kích thước lớn hơn. Nhà bán lẻ trực tuyến lớn nhất thế giới dự kiến ​​sẽ đưa ra.

ĐỪNG BỎ LỠ