当想把某个标签或者字体等设置的更小--关于元素的相对定位和绝对定位

超、凢脫俗 2023-06-06 12:04 3阅读 0赞

# 将某个元素缩小 #

例如字体我想设置的更小，例如谷歌浏览器最小为12px，所以用到下面这种方式，用缩放来伪解决，缩放为原来的0.9倍。  
transform:scale(0.9);

# css设置圆角，达到圆的展示效果 #

![在这里插入图片描述][20191011155159487.png]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70]

详解网址：使用css的属性设置来解决，CSS3 圆角属性 border-radius，具体可以看下面网址详解，

https://blog.csdn.net/wuxiaopeng\_1986/article/details/52621690

# 关于某元素的位置控制 #

### （例如实现图标右上角有个未读数，看图） ###

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70 1]上图实现方式：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70 2]

这里就要设计绝对定位和相对定位了，直接百度，或者去csdn收藏里看。我收藏了关于定位的，看下图简单使用

[20191011155159487.png]: /images/20230601/598ee7682c9b4b13bd1fbcc322b0658d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70]: /images/20230601/7d5894b6a31b49e59759bb16f17233d9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70 1]: /images/20230601/d8ce35439a6640e59b43f9aeaa1e378a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mzc2OTU2Ng_size_16_color_FFFFFF_t_70 2]: /images/20230601/7357a73c43494cb8b454c4044b1bf0c9.png