👉 Giải thích về căn chỉnh hình ảnh WordPress cơ bản - WinningWP

Xếp hạng Alexa – Ảnh chụp màn hình

Chủ đề của việc sắp xếp hình ảnh là một chủ đề thường bị hiểu nhầm bởi người mới sử dụng WordPress. Khi bạn đi để thêm một hình ảnh vào nội dung của bạn (trong một trong hai bài viết hoặc trang), WordPress cung cấp cho bạn bốn cách mặc định để căn chỉnh hình ảnh đã nói: align 'Left', align 'Center', align 'Right' và align 'None' *.

Chúng ta hãy cùng nhau xem xét:

1. Căn trái

Một hình ảnh được gán một liên kết bên trái sẽ được đẩy sang bên trái của phần của trang mà nó nằm (chẳng hạn như đường biên trái của bài đăng WordPress của nội dung trang) và bất kỳ nội dung nào khác (chẳng hạn như văn bản) sẽ quấn quanh ba biên giới khác của nó – điền vào khu vực bên phải của hình ảnh.

Thí dụ:

Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur. Ngoại trừ sint occaecat cupidatat non proident, sunt trong culpa qui officia deserunt mollit hoạt hình id est laborum. Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Ut enim ad minim veniam, quis nostrud tập thể dục ullamco laboris nisi ut aliquip ex ea commodo hậu quả. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur.

2. Căn giữa

Nếu bạn muốn hình ảnh của mình được tập trung trong phần của trang mà nó nằm (tức là với khoảng cách bằng nhau giữa cạnh của vùng nội dung và đường viền trái và phải), hãy chọn căn chỉnh 'Trung tâm'. Không giống như liên kết 'Trái' được đề cập ở trên, bất kỳ nội dung lân cận nào (chẳng hạn như văn bản) sẽ không bao quanh hình ảnh – thay vào đó, được định vị ở trên hoặc bên dưới hình ảnh (tùy thuộc vào vị trí trong văn bản bạn đã chọn để chèn hình ảnh đã nói).

Thí dụ:

Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur. Ngoại trừ sint occaecat cupidatat non proident, sunt trong culpa qui officia deserunt mollit hoạt hình id est laborum.

3. Căn phải

Căn chỉnh một hình ảnh, như bạn mong đợi, khá nhiều sự đảo ngược chính xác của việc căn chỉnh một hình ảnh – hình ảnh sẽ được đẩy sang bên phải của phần của trang mà nó nằm (tức là ranh giới bên phải của bạn WordPress bài viết của nội dung trang), và bất kỳ nội dung khác (chẳng hạn như văn bản, vv) sẽ quấn quanh ba biên giới khác của nó: do đó làm đầy khu vực bên trái của nó.

Thí dụ:

Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur. Ngoại trừ sint occaecat cupidatat non proident, sunt trong culpa qui officia deserunt mollit hoạt hình id est laborum. Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Ut enim ad minim veniam, quis nostrud tập thể dục ullamco laboris nisi ut aliquip ex ea commodo hậu quả. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur.

4. Căn chỉnh Không

Các hình ảnh không có sự liên kết được gán cho chúng (bằng cách phân bổ chúng một liên kết 'Không'), sẽ đặt chính xác ở vị trí bạn định vị chúng – tức là nếu bạn chọn định vị một ảnh được gán một căn chỉnh 'Không' trong một đoạn văn bản (xem ví dụ dưới đây), nó sẽ được định vị nội tuyến với văn bản đó, điều này sẽ dẫn đến văn bản ở cả bên trái và bên phải của hình ảnh (giả sử hình ảnh không có cùng chiều rộng – hoặc rộng hơn – so với khu vực) trong đó nó nằm **). Tuy nhiên, gây nhầm lẫn, một hình ảnh có BOTH được gán cho một liên kết 'Không' và nằm trong đoạn riêng của nó (tức là trên một dòng mới trong trình soạn thảo WordPress và / hoặc cụ thể trong các thẻ HTML 'p') sẽ được đặt ở bên trái của khu vực mà nó cư trú (theo cách tương tự với nó nếu nó có nó đã được trái liên kết) nhưng không có bất kỳ văn bản ở bên phải của nó. Tại sao? Bởi vì một hình ảnh không có sự liên kết cụ thể (hoặc, trong thuật ngữ công nghệ ': không có' trái 'hay' bên trái 'cụ thể) nằm trong đoạn rất riêng của nó (không có phần tử nào khác trong cùng một đoạn) sẽ được tách khỏi cả hai phần trước của nó và theo dõi nội dung theo các dòng của khoảng trắng được xác định trước – theo cùng cách mà bất kỳ đoạn văn nào khác sẽ làm!

Thí dụ:

Lorem ipsum dolor ngồi amet, consectetur adipiscing elit, sed làm eiusmod thời gian incididunt ut labore và dolore magna aliqua. Duis aute irure dolor trong reprehenderit trong voluptate velit esse cillum dolore eu fugiat nulla pariatur. Ngoại trừ sint occaecat cupidatat non proident, sunt trong culpa qui officia deserunt mollit hoạt hình id est laborum.

Vậy điều gì đang diễn ra ở đây?

Tại sao tất cả điều này xảy ra? Nó thực sự là tất cả do một ngôn ngữ máy tính được sử dụng để thể hiện các bài thuyết trình (bố trí, kích thước, màu sắc, vv) của các yếu tố web, được gọi là Cascading Style Sheets – hoặc 'CSS' cho ngắn. Về bản chất, mỗi khi bạn chỉ định, nói, căn trái với hình ảnh trong bài đăng hoặc trang, ví dụ, WordPress gắn thêm một tên lớp HTML là “alignleft” vào hình ảnh đã cho biết, sau đó có hiệu lực buộc hình ảnh tham chiếu đến một tập hợp cụ thể các lệnh CSS được xác định trước cho biết vị trí cần đặt trên trang – đơn giản! Tương tự như vậy, đối với mỗi sắp xếp khác được đề cập, WordPress gán tên lớp khác nhau – chẳng hạn như 'aligncenter' (cho hình ảnh được căn giữa), 'alignright' (cho hình ảnh được căn phải) và 'alignnone' (cho hình ảnh không có sự liên kết cụ thể nào được gán) – mỗi tham chiếu các tập lệnh CSS khác nhau.

Phải thừa nhận (thật không may), ý tưởng gói đầu của bạn xung quanh thế giới của các lệnh CSS có thể nhiều hơn một chút khó khăn đối với người dùng WordPress trung bình; tuy nhiên, nếu bạn quan tâm để tìm hiểu thêm về họ, họ sẽ nhanh chóng cho phép bạn đạt được một mức độ tự do hoàn toàn mới khi nói đến tạo kiểu cho nội dung của bạn – hoặc thậm chí toàn bộ trang web của bạn! Nếu bạn quan tâm đến việc học tập, hãy xem bài đăng trước của chúng tôi về nơi tốt nhất để học CSS trực tuyến – hoặc, cách khác, chỉ cần chuyển sang làm tốt hơn 'Google và trở nên hoang dã! ;)

Tóm lược

Vì vậy, có bạn có nó: hình ảnh sắp xếp giải thích! Trong ngắn hạn: sử dụng một căn trái khi bạn muốn một hình ảnh để ngồi bên trái và các yếu tố khác (như văn bản vv) để quấn quanh nó ở bên phải; sử dụng một căn chỉnh trung tâm khi bạn muốn một hình ảnh để ngồi ở giữa / trung tâm của nội dung của bạn không có các yếu tố khác ở hai bên của nó; sử dụng một căn phải khi bạn muốn một hình ảnh ngồi bên phải và các yếu tố web lân cận khác để quấn quanh nó ở bên trái; và sử dụng căn chỉnh 'không' nếu bạn muốn hình ảnh của mình được đặt chính xác nơi bạn chọn để đặt nó tương ứng với các phần tử lân cận của nó (ví dụ: văn bản v.v.) – VÀ cuối cùng, nếu bạn muốn một hình ảnh được đặt ở bên trái nội dung -area trong đó nó cư trú NHƯNG không muốn bất kỳ văn bản vv xuất hiện ở bên phải của nó, gán hình ảnh một sự liên kết của 'Không' và đảm bảo nó nằm trong đoạn riêng của mình!

* thông qua trình đơn thả xuống được tìm thấy ở dưới cùng bên phải của cửa sổ 'Thư viện phương tiện' WordPress, dưới tiêu đề phụ 'Cài đặt hiển thị tệp đính kèm'.

** trong trường hợp văn bản thường ngồi ở hai bên của nó sẽ không còn chỗ nào khác ngoài hình trên hay dưới ảnh – lưu ý rằng những trường hợp như thế thường có thể dẫn đến sự nhầm lẫn giữa tất cả bốn sắp xếp vì không có chỗ cho bất kỳ văn bản / yếu tố ở hai bên của hình ảnh về cơ bản sẽ không tạo ra sự khác biệt nào mà bạn chọn để sử dụng!

Hữu ích?

Xem video: Edit iphone at the end of the time saving

Like this post? Please share to your friends:
Trả lời

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: