HTML中忽略的小问题

时间:2022-01-05 15:41:56

1、padding和margin

例子 1

padding:10px 5px 15px 20px;(上,右,下,左)
  • 上内边距是 10px
  • 右内边距是 5px
  • 下内边距是 15px
  • 左内边距是 20px

例子 2

padding:10px 5px 15px;
  • 上内边距是 10px
  • 右内边距和左内边距是 5px
  • 下内边距是 15px

例子 3

padding:10px 5px;
  • 上内边距和下内边距是 10px
  • 右内边距和左内边距是 5px

2、值得问题

描述
auto 浏览器计算内边距。
length 规定以具体单位计的内边距值,比如像素、厘米等。默认值是 0px。
% 规定基于父元素的宽度的百分比的内边距。
inherit 规定应该从父元素继承内边距。【任何的版本的 Internet Explorer (包括 IE8)都不支持属性值 "inherit"。】


3、background-attachment:fixed

(图像短于内容时)背景图像不会随页面的其余部分滚动。

不加此属性,或者background-attachment:scroll,背景随文字固定。

4、margin负值在页面布局中应用

参考http://www.cnblogs.com/jscode/archive/2012/08/28/2660078.html

5、为边框或按钮制作成圆角

向 div 元素添加圆角边框:

div
{
border:2px solid;
border-radius:25px;
}

6、list-style-type 接触html,css都快一年了,也曾写过几个小的网站,但都没有注意到这个属性。 这个属性是列表里的,在w3c里看到直接在ul或者ol标签内写type,试了试无效果,后来又百度了下,需要在css里写list-style-type这个属性,才会出来效果,加上hover用,来回来变换会很有意思,颜色可根据设置的字体的颜色同步变化。
让图标缩进:list-style:inside; 或者list-style-type:类型  inside;(两者结合用)