精通CSS第三版

所需积分/C币:48 2019-04-04 11:51:55 18.25MB PDF
收藏 收藏 5
举报

本书是CSS设计经典图书升级版,结合CSS近年来的发展,尤其是CSS3和HTML5的特性,对内容进行了全面改写。本书介绍了涉及字体、网页布局、响应式Web设计、表单、动画等方面的实用技巧,并讨论了如何实现稳健、灵活、无障碍访问的Web设计,以及在技术层面如何实现跨浏览器方案和后备方案。本书还介绍了一些鲜为人知的高级技巧,让你的Web设计脱颖而出。
This book is dedicated to all my colleagues at Clearleft-both past and present. Were it not for their support and wisdom, this book would never have happened Andy budd Dedicated to the memory of my grandfather: the engineer, artist, and life-long tinkerer Sven Forsberg( 1919-2016) emil bjorklund Contents at a glance About the authors ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ About the technical reviewers umm xix Acknowledgments Introduction…nm Chapter 1: Setting the Foundations ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■口■■■■■■■■■ Chapter 2: Getting Your Styles to Hit the Target,,,,…,,,…,……17 Chapter 3: Visual Formatting Model Overview aaamamamamammmammmammmmmmm 39 Chapter 4: Web Typography mmmmmmmmmmm 61 Chapter 5: Beautiful Boxes ■■■■■■■■■■■■■口■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■口■■口■■■■■■■■■■■■■■■■■■■■口■国■■■口■■■ 101 Chapter 6: Content layout u143 Chapter 7: Page Layout and Grids BBR Banan 185 Chapter 8: Responsive Web Design cSs ■■■■■■■■■■■■■■■■■口■■■■■■■■■■■■■■■■■■■■口■■■■■■■■■■■■■■■■■■ 223 Chapter 9: Styling Forms and Data Tables. 263 Chapter 10: Making It Move: Transforms, Transitions, and Animations amman 299 ■ Chapter11:Cutg- edge Visual Effects,,,,,…,,m,,,…,,335 Chapter 12: Code Quality and Workflow n371 Index 403 Contents About the authors ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ About the technical reviewers umm xix Acknowledgments Introduction…nm Chapter 1: Setting the Foundations an ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■口■■■■■■■■■■■■■■■■■■■国■■■■圆 Structuring your Code Maintainability 2 A Brief History of Markup…… 2 Progressive Enhancement 5 Creating Structurally and Semantically Rich HTML 7 Class and id attributes Structural elements Using Divs and Spans. Presentational text elements Redefined 12 Extending the Semantics of HTML 日面日面日面日日日日日日日自日日自日日日自日日自日日自日日自日日自日日自日日自日日自日日自日日 12 Validation 15 Summary 15 Chapter 2: Getting Your Styles to Hit the Targetmmen ■■■■■■■■■■■■■■■■■■■圆■■圆■国■■■■■■■■ 17 CSS Selectors 17 Child and sibling selectors 日日日日日日日日日日日自日日自日日自日日自日日自日日自日日自日日自日日日日日日日日日日日面日面 18 The Universal selector Attribute se! lectors……… Pseudo-Elements CONTENTS Pseudo-Classes 24 Structuralpseudo-classeswwwwwwwww.25 Form pseudo-Classes. The cascade 29 Specificity 29 Order of Rules when Resolving the cascade 30 Managing Specificity..................31 Specificity and Debugging…….… Inheritance 34 Applying Styles to your Document 35 The link and Style Elements. Performance Summary. Chapter 3: visual Formatting Model overview 39 Box Model Recap 39 B0 X-Sizing…....40 Minimum and maximum values The visual Formatting model Anonymous Boxes…,, 46 Margin Collapsing… Containing B0Cks….....…,48 Relative Positioning…....………,49 Absolute Positioning Fixed Positioning 50 F| oating………51 Formatting Contexts…........,….56 Intrinsic and Extrinsic Sizing Other cSs layout Modules . F| exible b0 X Layout.………, 58 Grid layout V11 CONTEN Multi-Column layout 59 Summary…… 59 Chapter 4: Web Typograph 61 Basic Typesetting in CSS 61 Text color 63 Font Size and line height 65 Line Spacing Alignment, and the anatomy of Line Boxes Font Weights… 70 Font style.......................71 Transforming Case and Small-Cap Variants…,,,…, Changing the space Between Letters and Words.....……………72 Measure, rhythm, and rag 73 Text Indent and Alignment Hyphenation…… Setting Text in Multiple Columns....................................77 Web fonts 81 Licensing… The @font-face rule WebFonts,BroWsers,andPeormance87 oading Fonts with JavaScript...............................89 Advanced Typesetting Features 91 Numerals∴ Kerning options and Text rendering .. Text Effects 95 Using and abusing Text shadows 95 Using JavaScript to Enhance Typography...........................98 Further Type Inspiration 99 Summary. 99 IX CONTENTS ■ Chapter5: Beautiful B0Xes…,,,,…,…,,,,,,101 Background Color.…… 101 Color values and opacity 102 Background Image basics 104 Background Images VS Content Images 105 Simple Example Using Background Images Loading Images(and other files) 108 Image Formats 109 Background Image Syntax 109 Background position 109 Background Clip and origin Background Attachment.…………114 Background Size 115 Background Shorthand................117 Multiple Backgrounds…,,.,.,.,.,,,,…,… 117 Borders and rounded corners Borderradiusroundedcornerswwwwwww.119 Creating Circles and Pill Shapes with Border radius 122 Border Images.…,,,, 123 Box-Shadow 125 Spread Radius: Adjusting the size of the shadow 126 nset shadows…… 126 Multiple shadows.....,.,,,,…,,… 127 Using css gradients Browser Support and Browser Prefixes. Linear gradients Radia| Gradients…131 Repeating Gradients.........,…………133 Gradients as patterns wwww 133 INTENTS Styling Embedded Images and other object 136 The Flexible Image Pattern.........,.,……,,………137 New object-Sizing Methods 138 Aspect- Ratio aware flexible containers..,..,.….………139 Reducing Image File Sizes 141 Summary .142 Chapter 6: content Layout n143 Using positioning 143 Absolute Positioning Use Cases…..,.,…,,…124 Positioning and z-ndex: Stacking Context Pitfalls…...…..,…,… 149 Horizontal layout . Using Floats… 150 Inline block as a layout Tool 153 Using Table Display properties for layout 159 Pros and cons of the Different Techniques 日日日日日自日日日日日日自日日自日日自日日自日日自日日自日日自日日自日日日日面 160 Flexbox 161 Browser Support and Syntax Understanding Flex Direction: Main and cross Axis 16 Alignment and Spacing . Flexible sizes w168 Wrapping Flexbox Layouts Column layout and individual ordering 177 Nested Flexbox layouts..……180 Fexb0 x Fallbacks…182 Flexbox Bugs and Gotchas Summary …184 CONTENTS Chapter7: Page Layout and Grids…,,,,,,,,…,,…,,,,185 Planning your layout 185 grids Layout Helper classes.........................................187 Using ready- Made Design Grids and Frameworks…………187 Fixed. fluid, or elastic 188 Creating a Flexible Page layout ,189 Defining a content Wrapper..... .191 Row containers 193 Creating Columns 194 Fluid gutters 199 Enhanced Columns: Wrapping and Equal Heights .204 Flexbox as a general Tool for Page Layout 207 The cSs grid Layout Module 2D layout 209 Understanding the grid Terminology.........………210 Defining Rows and Columns......................................211 Placing Items on the grid.. 213 Automatic grid placement 216 Grid Template Areas.....................................219 Summary 222 Chapter 8: Responsive Web Design CSs ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■口■■■■■■ 223 A Responsive Example 223 Starting Simple 223 Introducing Our First Media Query. Finding Further Breakpoints. The roots of responsiveness 228 Responsive beyond cSs 229 How Browser Viewports Work 230 Nuances of the viewport Definition….,…,,…230 Configuring the viewport…..…232

...展开详情
试读 127P 精通CSS第三版
立即下载 低至0.43元/次 身份认证VIP会员低至7折
一个资源只可评论一次,评论内容不能少于5个字
Nothing_li 英文版的!
2019-04-20
回复
  • 脉脉勋章

    绑定脉脉第三方账户获得
关注 私信 TA的资源
上传资源赚积分,得勋章
最新推荐
精通CSS第三版 48积分/C币 立即下载
1/127
精通CSS第三版第1页
精通CSS第三版第2页
精通CSS第三版第3页
精通CSS第三版第4页
精通CSS第三版第5页
精通CSS第三版第6页
精通CSS第三版第7页
精通CSS第三版第8页
精通CSS第三版第9页
精通CSS第三版第10页
精通CSS第三版第11页
精通CSS第三版第12页
精通CSS第三版第13页
精通CSS第三版第14页
精通CSS第三版第15页
精通CSS第三版第16页
精通CSS第三版第17页
精通CSS第三版第18页
精通CSS第三版第19页
精通CSS第三版第20页

试读结束, 可继续阅读

48积分/C币 立即下载 >