CSS Floating: Floats and Float Shapes

در حالی که جریان متن در اطراف تصاویر مطمئنا چیز جدیدی نیست، با CSS می توانید هر عنصری را شناور کنید، از تصاویر گرفته تا پاراگراف ها و لیست ها. در این راهنمای عملی، نویسنده Eric Meyer راه‌های جالب و شگفت‌انگیز را برای استفاده از شناورهای CSS در طراحی وب‌تان نشان می‌دهد، از جمله آخرین قابلیت برای جریان دادن محتوا به شکل شناور غیر مستطیلی.

کوتاه و شیرین، این کتاب گزیده ای از ویرایش چهارم CSS: راهنمای قطعی است. وقتی نسخه چاپی یا کتاب الکترونیکی CSS Floating را خریداری می‌کنید، پس از انتشار برای کل راهنمای قطعی تخفیف دریافت خواهید کرد. چرا صبر کنیم؟ اکنون یاد بگیرید که چگونه به صفحات وب خود جان ببخشید.

• ویژگی های عناصر شناور و قوانین CSS برای استفاده از آنها را بیاموزید
• در هنگام اعمال شناورها از استثنائات قوانین خاصی آگاه باشید. برای طراحی خود، از جمله استفاده از حاشیه های منفی
• از ویژگی clear برای جلوگیری از تأثیر شناور بر عناصر در بخش بعدی سند استفاده کنید
• ایجاد شناور جعبه هایی به اشکال غیر مستطیلی، از جمله گوشه های گرد، دایره ها، بیضی ها و حتی چند ضلعی ها
• شکل های شناور را با تصاویر شفاف یا مات تعریف کنید

While flowing text around images is certainly nothing new, with CSS you can float any element, from images to paragraphs to lists. In this practical guide, author Eric Meyer reveals some interesting—and surprising—ways to use CSS floats in your web design, including the latest capability to flow content past non-rectangular float shapes.

Short and sweet, this book is an excerpt from the upcoming fourth edition of CSS: The Definitive Guide. When you purchase either the print or the ebook edition of CSS Floating, you’ll receive a discount on the entire Definitive Guide once it’s released. Why wait? Learn how to bring life to your web pages now.

• Learn the characteristics of floated elements, and CSS rules for using them
• Be aware of certain rule exceptions when applying floats to your design, including the use of negative margins
• Use the clear property to prevent floats from affecting elements in the next section of the document
• Create floating boxes in non-rectangular shapes, including rounded corners, circles, ellipses, and even polygons
• Define float shapes with transparent or opaque images