想用一个div 把整个页面填充,代码会怎么写???
标题
Hello
测试
用浏览器查看后,效果不是想要的,高度没有100%???
是浏览器兼容问题???
试了其他浏览器,结果一样,还是不行。
这个p标签的100% 是相对其父元素的,如果设置了body的宽度和高度以后,应该就没有问题了。
结果效果有点像了,但还是没有达到要求,这是因为在ie中默认情况下,
body 元素的margin属性有一个默认值,再给 body加上margin:0px 就好了。
这里贴出常见浏览器中一些默认的属性值:
浏览器默认样式
1.页边距
IE默认为10px,通过body的margin属性设置
FF默认为8px,通过body的padding属性设置
要清除页边距一定要清除这两个属性值
body {
margin:0;
padding:0;
}
2.段间距
IE默认为19px,通过p的margin-top属性设置
FF默认为1.12em,通过p的margin-bottom属性设
p默认为块状显示,要清除段间距,一般可以设置
p {
margin-top:0;
margin-bottom:0;
}
3.标题样式
h1~h6默认加粗显示:font-weight:bold;。
默认大小请参上表
还有是这样的写的
h1 {font-size:xx-large;}
h2 {font-size:x-large;}
h3 {font-size:large;}
h4 {font-size:medium;}
h5 {font-size:small;}
h6 {font-size:x-small;}
个大浏览器默认字体大小为16px,即等于medium,h1~h6元素默认以块状显示字体显示为粗体,
要清除标题样式,一般可以设置
hx {
font-weight:normal;
font-size:value;
}
4.列表样式
IE默认为40px,通过ul、ol的margin属性设置
FF默认为40px,通过ul、ol的padding属性设置
dl无缩进,但起内部的说明元素dd默认缩进40px,而名称元素dt没有缩进。
要清除列表样式,一般可以设置
ul, ol, dd {
list-style-type:none;
margin-left:0;
padding-left:0;
}
5.元素居中
IE默认为text-align:center;
FF默认为margin-left:auto;margin-right:auto;
6.超链接样式
a 样式默认带有下划线,显示颜色为蓝色,被访问过的超链接变紫色,要清除链接样式,一般可以设置
a {
text-decoration:none;
color:#colorname;
}
7 鼠标样式
IE默认为cursor:hand;
FF默认为cursor:pointer;。该声明在IE中也有效
8 图片链接样式
IE默认为紫色2px的边框线
FF默认为蓝色2px的边框线
要清除图片链接样式,一般可以设置
img {
border:0;
}
1.页边距
IE默认为10px,通过body的margin属性设置
FF默认为8px,通过body的padding属性设置
要清除页边距一定要清除这两个属性值
body {
margin:0;
padding:0;
}
2.段间距
IE默认为19px,通过p的margin-top属性设置
FF默认为1.12em,通过p的margin-bottom属性设
p默认为块状显示,要清除段间距,一般可以设置
p {
margin-top:0;
margin-bottom:0;
}
3.标题样式
h1~h6默认加粗显示:font-weight:bold;。
默认大小请参上表
还有是这样的写的
h1 {font-size:xx-large;}
h2 {font-size:x-large;}
h3 {font-size:large;}
h4 {font-size:medium;}
h5 {font-size:small;}
h6 {font-size:x-small;}
个大浏览器默认字体大小为16px,即等于medium,h1~h6元素默认以块状显示字体显示为粗体,
要清除标题样式,一般可以设置
hx {
font-weight:normal;
font-size:value;
}
4.列表样式
IE默认为40px,通过ul、ol的margin属性设置
FF默认为40px,通过ul、ol的padding属性设置
dl无缩进,但起内部的说明元素dd默认缩进40px,而名称元素dt没有缩进。
要清除列表样式,一般可以设置
ul, ol, dd {
list-style-type:none;
margin-left:0;
padding-left:0;
}
5.元素居中
IE默认为text-align:center;
FF默认为margin-left:auto;margin-right:auto;
6.超链接样式
a 样式默认带有下划线,显示颜色为蓝色,被访问过的超链接变紫色,要清除链接样式,一般可以设置
a {
text-decoration:none;
color:#colorname;
}
7 鼠标样式
IE默认为cursor:hand;
FF默认为cursor:pointer;。该声明在IE中也有效
8 图片链接样式
IE默认为紫色2px的边框线
FF默认为蓝色2px的边框线
要清除图片链接样式,一般可以设置
img {
border:0;
}
相关推荐
在工作中评论内容测试遇到评论着的评论内容为:“dddddddddddddddddddddddddddddddddddddddddddddddddd”,错误的评论,在显示评论列表的时候因为有固定宽,但是显示的内容超出的了div的宽,在这种情况下我们需要...
Div+CSS 是网页设计中常用的标签,以下是 Div+CSS 中常用的标签和属性。 文字标签 1. 标题文字:文字,其中 # 可以是 1-6,h1 为最大字,h6 为最小字。 2. 字体变化:文字,其中可以指定字体大小、字体名称、文字...
- **DIV**:块级元素,可以设置宽度和高度,通常用于布局。 - **SPAN**:行内元素,不支持设置宽度和高度,主要用于文本内容的修饰。 #### 六、CSS兼容性问题 - **CSS Hack**:针对不同浏览器的特性编写不同的CSS...
3. **CSS元素分类**:CSS中的元素主要分为三类:`block`(块级元素),如`p`、`h1`-`h6`、`ul`、`div`等,它们占据整行并可以设置宽度和高度;`inline`(内联元素),如`a`、`span`、`em`等,它们只占据内容本身的...
2. 通过CSS,我们可以为`<div>`设置宽度、高度、边距、内边距等属性,实现灵活的布局。 3. `class`和`id`属性用于给`<div>`添加唯一标识,便于CSS选择器定位和应用样式。 三、CSS布局技术 1. 浮动布局(Floats):...
- 常见的块级元素有`<div>`、`<p>`、`<h1>`、`<form>`、`<ul>`和`<li>`等。 - 块级元素的宽度默认为父元素的100%,可以通过CSS设定宽度、高度、行高以及边距来调整布局。 - 可以通过`display`属性将内联元素转换...
【CSS+DIV】是一种网页布局技术,通过使用HTML的`<div>`标签和CSS样式来实现页面元素的布局和美化。这种技术已经成为现代网页设计的标准,因为它提供了更灵活、更可维护的页面结构。 首先,了解`<div>`标签。`<div>...
3. **尺寸匹配** - `<iframe>` 的 `top` 和 `left` 属性应设为 `0`,并且 `<iframe>` 的宽度和高度应与 `<div>` 相同。 4. **透明度设置** - 为了不影响用户界面的美观,可以将 `<iframe>` 的透明度设为 `0`。 ...
`div`元素作为容器,常用于组织页面布局,可以通过CSS设置其宽度、高度和位置。例如,可能有一个大的`div`用于展示商品,而内部再包含多个小的`div`分别展示单个鞋子的信息。 在网页布局方面,由于项目描述提到...
CSS可以用来设置`div`的样式,如宽度、高度、颜色、位置等,使得`div`成为网页布局的核心工具。 接下来,我们来看一下`<body>`标签,它是HTML文档的主要内容区域。通过`oncontextmenu`属性,可以禁用右键菜单,如`...
1. 块级元素(如`<div>`、`<p>`、`<h1>`等): - 占满整个容器的宽度。 - 默认情况下,每个块级元素都会另起一行。 - 可以设置宽度、高度、外边距和内边距。 2. 内联元素(如`<span>`、`<a>`、`<em>`等): - ...
- **height**和**width**:控制元素的高度和宽度。 - **border**:定义元素的边框样式、宽度和颜色。 - **background**:设置元素的背景色或背景图像。 - **float**:使元素浮动,通常用于布局设计。 - **padding**...
CSS还支持盒模型,这决定了元素的宽度、高度及内外边距,是理解和控制网页布局的关键。 Div(Division)是HTML的一个块级元素,常被用作页面布局的容器。通过CSS,我们可以对Div进行定位(如使用position属性),...
例如,你可以设置`div`的宽度、高度、背景颜色、边框等属性,使其成为网页布局的基础块。`div`的灵活性在于它可以包含其他HTML元素,这样就可以构建出层次化的结构。 在描述中提到的charset属性,如`; charset=gb...
}`盒模型CSS中,元素被视为一个矩形盒子,包含内容(content), 内填充(padding), 边框(border)和外边距(margin)`box-sizing`属性决定盒子的宽度和高度计算方式,content-box(默认,总宽度=内容宽度+左右边框+左右填充...
【CSS布局常用标签】 ...以上就是关于`div+css`布局中常用标签及CSS相关知识点的详细说明,这些基础知识对于网页设计和开发至关重要。理解并熟练运用这些标签和属性可以有效提高页面布局的灵活性和可维护性。
例如,我们可以设置#Container的宽度和居中对齐,#Header的高度和背景色,#Sidebar的宽度和浮向左侧,#MainBody的宽度和与侧边栏的间距等。CSS的灵活性允许我们根据需要调整各个部分的样式,以达到理想的设计效果。 ...
HTML是一种标记语言,通过不同的标签来定义网页的结构和内容,如段落(`<p>`)、标题(`<h1>`至`<h6>`)以及链接(`<a>`)等。而DIV元素,全称为“division”,意为“分隔”,它是一个通用的容器,可以容纳任何HTML...
它是构建网页布局的基本构建块,通过设置`div`的宽度、高度、边距和对齐方式,可以实现复杂的页面设计。 4. **CSS布局**:CSS提供了多种布局技术,如盒模型(Box Model,包括内容、内边距、边框和外边距)、浮动...