什么是浏览器
解释和执行HTML源码的工具
五大浏览器:IE、FF(FireFox)(火狐)、Chrome(谷歌)、Opera(空中)、Safari(Apple)(苹果)
IE用的是Trident引擎(WebBrowser控件)
其它很多都用的是WebKit引擎(开源浏览器内核)
HTML:Hypertext Markup Language超文本标记语言
CSS:Cascading Style Sheet层叠样式表
静态页面和动态页面
静态页面:后缀名为html或htm的都是静态页面
动态页面:包括一些脚本代码,服务器动态生成的HTML页面发给浏览器
html、htm都是静态页面
asp、aspx、jsp、php等都是动态页面
HTML和XML的联系和区别
相同点
都是标记语言,注释都一样
都可以通过dom编程方式来访问
都可以通过CSS来改变外观
不同点
xml比html语法要求更严格
xml侧重于数据存储,html侧重于数据展示
样式表、CSS
CSS的好处
外观美化,布局,定位
实现内容与样式的分离,方便团队开发
方便统一定义格式,修改也方便
CSS的计量单位:px、%、em(相对单位)
CSS的属性:
background-color:背景颜色
border-style:边框风格 solid(实线)、dashed(虚线)、dotted(点)
border-width:边框宽度
border-color:边框颜色
display:元素是否显示 block(块级元素)、none(不显示)、inline(内联元素)
cursor:鼠标样式 pointer(小手)、text(输入Bean)、wait(忙沙漏)、help(帮助)
cursor:url(1.ani)使用ani和cur格式的自定义光标图片
list-style-type:none li不显示原点,设置在ul或者li上
margin:上右下左 与表格的cellspacing类似
padding:与表格的cellpadding类似
visibility:hidden隐藏
样式选择器:
标签选择器:input{}
class选择器:.cls{} 用多个类选择器的时候用空格隔开,以最后一个定义的重复类选择器为准
id选择器:#dv{}
标签+类选择器:input.cls{}
包含选择器(层次选择器):p strong{}
组合选择器:h1,h2,input{}
自选择器:div>p{}
相邻选择器:div+p
伪选择器: a:link{}没点之前
a:hover{}鼠标悬浮
a:active{}激活状态
a:visited{}访问以后
以上选择器的优先级是:
style>id选择器>类选择器>标签选择器(!important可以提高优先级 color:red !important)
使用CSS的三种方式:元素内联(行内样式表)、页面嵌入(内嵌样式表)、外部引用(外部样式表)
写入元素的style属性 在head中加入 css后缀文件(推荐)
文档流
position:absolute绝对定位
position:fixed固定定位
position:relative相对定位
position:static默认值
position:inherit继续父元素的position值
Div+CSS布局
不用<table>进行布局的原因
table可能会在所有的tr和td加载完成以后才显示,所以加载完成之前一片空白
用table布局会将布局方式写在html中,违反了“语义性”原则
用table会影响搜索引擎的抓取,不利于SEO
Div+CSS就是将要布局的内容用<div>切成块,然后使用css描述每个快的大小、位置等
float:left两个层并排排列
margin:0px auto层的相对居中
clear:both清楚浮动
共同学习,写下你的评论
评论加载中...
作者其他优质文章