html/css——注意事项

最新推荐文章于 2025-01-18 16:29:43 发布

转载最新推荐文章于 2025-01-18 16:29:43 发布 · 82 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wsj2000/p/10329991.html

本文深入探讨CSS的font系列、text系列属性，解析em、rem单位应用，行内标签特性，盒模型背景渲染，外边距传递与重叠性，浮动特性及清除方法，以及a超链接的多种功能。通过具体实例，帮助读者掌握CSS布局和样式调整的高级技巧。

font系列：
font-size
font-weight
font-family
font-style
line-height

复合写法：font:italic bolder 24px/40px '宋体'

em单位补充：
em是一个相对值，相对的是直接父级字体大小的倍数

rem相对单位

行内标签的特性：
1.共处一行
2.不能设置宽高
3.对上下外边距，内边距失效
4.会后面的空格都翻译成一个空格大小

强行转为块元素的方法：
display:block;
float:left;
position:absolute;

盒模型中会渲染背景色的属性：
内容区（width,height）
padding:内边距
border:边框线

上下外边距的传递性：
当元素的父辈中没有定位，浮动，边框线，内边距属性时，子元素的上下外边距会逐层传递给祖辈。
上下外边距的重叠性：
当上下相邻的两格元素都有上下外边距时，大值会覆盖小值。

浮动的特性：
1.强制转为块元素
2.脱离文档流
3.文本环绕
4.会使父级的默认高度丢失
5.会使浮动元素的默认宽度丢失

清除浮动的影响：
1.给浮动元素相邻的受浮动影响的元素加clear:both;注意：clear:both只能对块元素使用
2.父级中添加overflow:hidden;
3.给父级设置高度较为死板
4.float可以清除浮动影响针对特定场景
5.:after{ 伪类清除
content:"",
display:block;
clear:both;
}

a超链接的作用：
1.跳转页面
2.下载
3.锚点功能

1 margin:...px auto;
2 position:absolute;——绝对定位，父级相对定位
3 position:absolute;
上下左右全部为零，margin: auto;

转载于:https://www.cnblogs.com/wsj2000/p/10329991.html