1、在网页制作中padding:length是什么
就是规定元素具体的内间隙数值,例如padding:3px padding:2em padding:1rem padding:0 等
2、请教一个关于移动端网页制作的padding的问题,前端很常见的。
不需要减来减去的那么麻烦,只需要一个CSS属性即可:
div {上面这代码的意思就是盒子的宽度width属性将定义了内容区、内边距和边框的总宽度。
(而不再是默认的情况:width属性只代表内容区的宽度)
如此,你就可以尽情地使用 padding、border 了,不用再考虑怎么减来减去的,不论你设置了padding或border,都不会超出宽度的。
另外注意一下,IE7及更低版本的浏览器不支持该属性(手机浏览器都支持)。
3、网页设计中padding和文本缩进有什么区别。
文本缩进是控制一个方向的,而padding是控制多个方向的。
4、网页设计css布局问题
paddin:100px ,0px;
是上下100px 左右0px
padding:10px;
是上下左右各10
IE6 浏览器下 应该是有变化的。
火狐浏览器下 没有版变化 因为padding值 超过了li的高权度
IE7应该是和火狐一样的 这个我没有测试 因为没装IE7
产生这个问题的原因是IE和火狐对于padding的解释不同
IE会把padding值加到对象高度和宽度中,从而使对象变大
但是火狐不会这样,他会把padding的值从对象高度宽度中扣除
对象实际大小不发生变化,可用大小发生变化。
IE7改变了许多地方,变的和火狐有些相像了。
5、网页设计中的 padding: 0 10px 3px;是哈子意思啊 求解 非常感谢
padding:0 10px 3px;
等同于:
padding-top:0;
padding-left:10px;
padding-right:10px;
padding-bottom:3px;
6、网页设计中默认外 内边距是多少
这根据 不同HTML标记而异的。
一般是 0px
有些特殊标记 譬如 h1,h2,h3,h4,h5,h6,p,ul 等,默认就会有一定的外边距。
7、请教网页制作高手,固定了div的大小,更改div里面content的padding值,为什么div也会变?
width表示的是你的内容的宽度,而padding是内边距,是除内容外的部分到边线的距离,专margin是外边距,是表属示边线外面与另一个盒子之间的距离。
不论你如何设置内边距和外边距,width如果写好了,那么放载内容的宽度始终是width的值。
但是,这整个的div占的地方就不一样了。会随着内边距、外边距、边线、width的改变而改变。
如果你想让这个div占的地方始终不变,那么你需要给这个div里面再写一个div,并且不设置width和height,只写内外的边距,这样,不论你如果设置里面的div的内外边距(只要总的大小不超出外面div的width和height),外面的div的大小都不会再改变了。
8、网页设计CSS解释
光说解释,但不来知道解释哪些部源分?我就将我觉得该解释的说说吧。
以"#"开头的成为id选择器,在程序中用id="id名称"调用;以"."开头的成为类别选择器,在程序中使用class="类别名称"调用;二者实现效果一样,只是在不同情况下按需选择。此外还有标记选择器和行内样式两种css样式。
常用选项解释:padding表示内边距;margin表示外边距;float表示浮动属性(设置该属性后可实现图文混排);background-image表示背景图片;background-repeat表示是否允许背景重复;border表示边框;text-align表示文本水平居中显示。
padding:10px 0px 0px 0px;从上开始表示顺时针内边距分别为10px,0px,0px,0px。margin和border的用法与padding类似,可以类推;
border-bottom:1px solid #CAEFC4表示下边框为1px实线颜色为#CAEFC4。其他各边以此类推。
差不多了吧,呵呵,祝你好运!
9、在网页设计中,margin值和padding为负数是否合理?
margin使用负数比较常见,使用负数是为了让标签向某个方位缩进,这样就不用加position属性来定位了,例如多个div使用负数可以达到层叠的效果,有点类似多张白纸叠在一起的感觉
而padding使用负数的话,一般页面效果会更差,至少我还没想到怎样的页面布局需要用到padding的负数值
10、网页设计导航条
下面的代码,你去看看,不好用再说。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
<!--
body {
background-color: #0099FF;
}
#navigation {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#navigation ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navigation li {
border-bottom-style: none;
border-bottom-color: #ed9f9f;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-top-color: #ed9f9f;
border-right-color: #ed9f9f;
border-left-color: #ed9f9f;
float: left;
}
#navigation li a {
text-decoration: none;
display: block;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 0.5em;
border-right-width: 1px;
border-left-width: 12px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #711515;
border-left-color: #711515;
border-top-style: none;
border-bottom-style: none;
width: 50px;
text-align: center;
margin: 0px;
}
#navigation li a:link, #navigation li a:visited {
color: #FFFFFF;
background-color: #c11136;
}
#navigation li a:hover {
color: #ffff00;
background-color: #990020;
}
#navigation ul li:hover ul,#navigation ul a:hover ul {
visibility: visible;
}
#navigation ul ul {
visibility: hidden;
}
#navigation ul ul li {
clear: both;
}
#navigation ul ul li a {
border: 1px solid #CCCCCC;
}
#navigation ul ul li a:link, #navigation ul ul li a:visited {
color: #000000;
background-color: #FFCC66;
}
#navigation ul ul li a:hover {
color: #006699;
background-color: #99CC00;
}
.nav {
border: 1px solid #0099CC;
position: absolute;
width: 357px;
left: 112px;
top: 34px;
}
.nav ul {
margin: 0px;
padding: 0px;
list-style-type: none;
font-size: 12px;
}
.nav li {
float: left;
}
.nav li a {
border: 1px solid #FF3333;
display: block;
padding: 5px;
background-color: #FFCC33;
text-decoration: none;
}
-->
</style>
</head>
<body>
<div id="navigation">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">关于我们</a></li>
<li><a href="#">产品展示</a>
<div>
<ul>
<li><a href="#">产品1一</a></li>
<li><a href="#">产品2一</a></li>
<li><a href="#">产品3一</a></li>
<li><a href="#">产品4一</a></li>
<li><a href="#">产品5一</a></li>
<li><a href="#">产品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">联系电话</a>
<div>
<ul>
<li><a href="#">产品1一</a></li>
<li><a href="#">产品2一</a></li>
<li><a href="#">产品3一</a></li>
<li><a href="#">产品4一</a></li>
<li><a href="#">产品5一</a></li>
<li><a href="#">产品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">公司介绍</a></li>
</ul>
</div>
</body>
</html>