.class { -webkit-text-size-adjust: none; /* Safari和Chrome浏览器中禁用文字尺寸自适应 */ -webkit-box-sizing: border-box; /* Safari和Chrome浏览器中使用可视区域作为盒子尺寸 */ -moz-box-sizing: border-box; /* Firefox浏览器中使用可视区域作为盒子尺寸 */ -ms-box-sizing: border-box; /* IE浏览器中使用可视区域作为盒子尺寸 */ box-sizing: border-box; /* 标准盒模型中使用可视区域作为盒子尺寸 */ -moz-column-count: 2; /* Firefox浏览器中使用2列列布局 */ column-count: 2; /* 标准中使用2列列布局 */ -webkit-column-gap: 20px; /* Safari和Chrome浏览器中设置列之间的间距 */ -moz-column-gap: 20px; /* Firefox浏览器中设置列之间的间距 */ column-gap: 20px; /* 标准中设置列之间的间距 */ -webkit-column-rule: 2px solid #ccc; /* Safari和Chrome浏览器中设置列之间的边框 */ -moz-column-rule: 2px solid #ccc; /* Firefox浏览器中设置列之间的边框 */ column-rule: 2px solid #ccc; /* 标准中设置列之间的边框 */ }
这些脱标的属性,虽然限定在特定的框架或者浏览器中使用,但是它们的使用可以让网页设计更加灵活。同时,这些属性的不同实现,也带来了不同的视觉效果,为设计师提供了更多选择的空间。