html实验报告(100字)

发表于:2021.1.22来自:www.fanwen118.com字数:100 手机看范文

教育信息技术与传媒学院

Institute of Educational Information Technology and Communication

html实验报告

Web教育平台开发实验报告 学号 101405619 姓名 陈芳 专业 信息技术 班级 本科班

html实验报告

教师评语

html实验报告

日期: 2013 年 3月 11 日




第二篇:html 3500字

兼容问题:计算一定要精确,不要让内容的宽高超出我们设置的宽高

在IE6下,padding值会撑开设置好的宽高,减去对应的padding值

在IE6,7下,元素浮动如果宽度需要内容撑开,里边的块元素都要加浮动

在IE6,7下,元素要通过浮动并在同一行,就给这行元素都加浮动 注意标签嵌套规范

IE6下最小高度问题:在IE6下,元素的高度小于19px的时候,会被当作19px处理 解决方法:给样式加 overflow:hidden;

边框点线问题:1px 点线在IE6不支持 解决方法:切背景平铺

在IE6下解决Margin传递要触发该样式的haslayout:

overflow:hidden;zoom:1;

在IE6下,父级有边框的时候,子元素的margin值消失 解决方法:触发父级的haslayout: zoom:1;

IE6下双边距BUG

在IE6下,块元素有浮动横向的margin值,横向的margin会被放大成两倍 margin-right:一行右侧第一个元素有双边距

margin-left:一行左侧第一个元素有双边距

解决方法:display:inline;

在IE6,7下,li本身没浮动,但li里面的内容有浮动,li下就会产生间隙 解决方法:1.给li加浮动,同时要设宽度 2.给li接加vertical-align:top;

当IE6下,元素的高度小于19px的时候和li的间隙问题共存的时候:给li加浮动,overflow:hidden;设宽度

当一行子元素占有的宽度之和 和父级相差超过3px,或者有不满行状态的时候,最后一行子元素的下margin在IE6下就会失效

IE6下文字溢出BUG:子元素的宽度和父级的宽度相差小于3px的时候,两个浮动元素中间有注释或内嵌元素

解决方法:用div把注释或内嵌元素包起来

当浮动元素和绝对定位元素是并列关系的时候,IE6下绝对定位会消失 解决方法:给定位元素外面包DIV

在IE6,7下,子元素有相对定位的话(position:relative);父级的

(overflow:auto)包不住子元素

解决方法:给父级也加相对定位(position:relative);

在IE6下绝对定位元素的父级宽高是奇数的时候,元素的right值和bottom值会有1px的偏差

在IE6,7下,输入类型的表单控件一般用div包住

在IE6,7下,输入类型的表单控件上下各有1px间隙

解决方法:给input加浮动(folat:left)

在IE6,7下输入类型的表单控件加:border:none无效

解决方法:给input重置背景

在IE6,7下输入类型的表单控件输入文字的时候,背景图片跟着移动 解决方法:把背景加给父级,再把自身的背景清掉(background:none)

背景图全屏:background-size: cover

图片刚好一屏的,随着滚动条的移动:background-attachment: fixed

要<Input>标签中的文字垂直居中,要在定义input的样式中摄设置高度和行高相同

标签命名规范:p标签里不能包含块标签

给li加hover不抖动==>:li{ padding:1px;} li:hover{ padding;0} background(url() no-repeat left(X轴) top(Y轴));一般用负数

background(url() no-repeat center top)顶部居中对齐

html

background(url() no-repeat center bottom)

padding: top right bootom left(上,右,下,左)

margin: top right bootom left(上,右,下,左)

居中:(margin-right:auto; margin-left:auto;)margin:0 auto; 常见文本:

font-size 文字大小(一般均为偶数)

font-family 字体(中文默认宋体)

color 文字颜色(英文、rgb、十六位进制色彩值) line-height 行高

text-align 文本对齐方式

text-indent 首行缩进(em缩进字符)

font-weight 文字着重

font-style 文字倾斜

text-decoration 文本修饰

letter-spacing 字母间距

word-spacing 单词间距(以空格为解析单位)

font:font-style | font-weight | font-size/line-height | font-family;

a伪类

link 未访问(默认)

hover 鼠标悬停(鼠标划过)

active 链接激活(鼠标按下)

visited 访问过后(点击过后)

IE6下最小高度

在IE6下高度小于19px的元素,高度会被当做19px来处理

解决方法:font-size

字体都有4个像素的偏差,有关设高的地方要减去4

浮动:

能不用浮动和margin出现的尽量不要用,用padding代替

清浮动:

1、

2、

3、

4、 给父级也加浮动(不推荐) 给父级加display:inline-block 在浮动元素下加<div class=”clear”></div> .clear{ height:0px; font-size:0; clear:both;} 在浮动元素下加<br clear=”all”/>

在IE6,7下浮动元素的父级有宽度就不用清浮动

Haslayout 根据元素内容的大小,或者父级的父级的大小来重新计算元素的宽高

display:inline-block

height:(任何值除了auto)

float:(left或right)

width:(任何值除了auto)

zoom:(除了normal外任意值)

给浮动元素的父类加上样式:

.clear:after{ content:""; display:block; clear:both;}

.clear{zoom:1;} ======>IE6,7下

给浮动元素的父级加Overflow 溢出 {Overflow :auto; zoom:1;}

auto 溢出显示滚动条

scroll 默认就显示滚动条

hidden 溢出隐藏

5、 6、

在IE6,7下,元素浮动要并在同一行的元素都要加浮动

IE6下双边距BUG

IE6下块元素有浮动,和横向的margin值会被放大两倍

解决办法:

转成内嵌:display:inline;

IE6,7下li下几px的间隙问题

在IE6,7下li本身没浮动,但是内容浮动了li下就会多出来几个像素 解决方法:

1. 给li加浮动

2. 给li加vertical-align:top

Body>html>

定位:

Position:relative:相对定位top/bottom/left/right控值,可以是负数(沿着原来的位置移动)

1. 不影响元素本身的特性

2. 不使元素脱离文档流

3. 如果没有定位偏移量,对元素本身没有任何影响

Position:absolute;绝对定位

1. 使元素完全脱离文档流

2. 使内嵌支持宽高

3. 块属性标签内容撑开宽度

4. 如果有定位父级相对于定位父级发生偏移,没有定位父级相对于整个文档

发生偏移

5. 相对定位(当绝对定位元素的父级)一般都是配合绝对定位元素使用

不透明度:opacity:0~1

IE下:filter:(alpha=0~10)

Ie6下父级的overflow:hidden;是包不住子级的相对定位的

在IE6下定位元素的父级宽高都为基数,那么在IE6下定位元素的right和bottom都有1像素的偏差,(一般把父级的宽高设成偶数)

更多类似范文
┣ HTML实验报告 100字
┣ HTML综合实验报告 20000字
┣ HTML标记的综合应用网页设计实验报告 3000字
┣ HTML实验报告(附图)
┣ 更多html实验报告
┗ 搜索类似范文

更多相关推荐:
.net实验报告8500字

实验一1实验要求基本的网页制作2目的掌握HTML与ASPX基础联系制作基本的ASPNET网页使用VS20xx提供的导航控件并结合站点地图制作基本的导航栏3工程截图工程运行效果图4关键代码Bigheadaspx关...

ASP课程设计实验报告12100字

ASPNET编程课程设计任务书设计题目基于ASPNET的综合性网站的设计系别计算机科学系专业广播电视新闻学数媒班级数媒084姓名曾奕薇学号20xx80144424指导老师程铭完成日期20xx年06月29日1目录...

网页设计1实验报告200字

课程实验报告专业年级20xx级网络工程课程名称网页设计与制作指导教师学生姓名学号20xx220xx51013实验日期20xx年11月19日实验地点笃行楼A栋306实验成绩教务处制20xx年11月19日

专栏推荐
大家在关注

地图地图CC