html5和css3知识总结

1. 首先要分别建立html,img和css3的文件夹。

2. html和css3的首页放在文件夹外面。还可以建立一个公共css,比如导航和页脚可以放在公共css里面,在每个页面加上公共css超链接就可以了。减少代码的编写。

3. 文件夹的名称要写成英文形式。也不要写成汉语拼音,html识别不出来汉字。

4.class与id的区别:

(1)、在CSS文件里书写时,ID加前缀"#";CLASS用"."

(2)、id一个页面只可以使用一次;class可以多次引用。 (3)、ID是一个标签,用于区分不同的结构和内容,就象名字,如果一个屋子有2个人同名,就会出现混淆;class是一个样式,可以套在任何结构和内容上,就象一件衣服;

(4)、从概念上说就是不一样的:id是先找到结构/内容,再给它定义样式;class是先定义好一种样式,再套给多个结构/内容。

 (5)目前的浏览器还都允许用多个相同ID,一般情况下也能正常显示,不过当你需要用JavaScript通过id来控制div时就会出现错误。

5.html中一些常见的特殊符号需要记住:空格 ©©; >> <<

6.Html5中position的定位主要分为绝对定位,相对定位,静态定位,固定定位,继承父级定位,语法分别为position:absolute|relative|static|fixed|inhret,定位之后可以设置top,bottom,left,right四个属性值,其中优先级:top>bottom,left>right

一.绝对定位

它是相对不是static最近一级父元素来进行定位的,被定位元素会脱离文档流,然后我们可以通过left,right,top,bottom来调整元素的位置 特点: 1.完全脱离文档流, 2.提升层级等级, 3.针对父级定位,如果父级没有定位,那就找父级上一级定位,如果父级上一级没有定位,最终以docment进行定位, 4.绝对定位一般配合相对定位使用,相对定位是父级,绝对定位是子级, 5.支持所有CSS样式, 6.提升定位元素层级的命令 z-index数字越大,越向上显示, 7.如果绝对定位的子集有浮动,可以不做清除浮动操作。

二.相对定位

 也就是相对于自己在文档流中的位置进行定位。

特点:

1.不脱离文档流,原有空间位置被保留,

2.针对自己本身位置进行定位,

3.不影响元素本身属性的设置

注意: 1.如果一个定位元素,同时设置了top和bottom,top的优先级更高,会显示top的值,

 2.如果同时设置Left和right的值,优先级取决于网页语言,在英语网页中left的优先级更高,会显示left的值,在阿拉伯语言网页中right的优先级更高,

3.如果一个元素设置了相对定位(甚至是做了偏移),其他元素排版时参考的依然是那个原有位置(没有设置偏移前的位置),

4.如果一个元素设置了相对定位,它的原有位置空间被保留。即使该元素做偏移,其他元素也不会占据它原有的(偏移前)的位置。

三.固定定位

是相对浏览器窗口(docment)进行定位的,同样也是脱离文档流,可以通过left,top,right,bottom来调整元素所在的位置。

特点:

1.一般用来做页面的导航部分与底部,

2.可以用来网页中插入广告和商业推广。

注意:在使用时候,尽量使用在页面的底部,因为即使脱离文档流也不会影响布局 四,几种定位简单比较总结

1.position:relative;不会脱离文档流 2.position:absolute|fixed;脱离文档流

3.absolute是相对于父级非static进行定位

4.fixed始终是相对于浏览器窗口进行定位。              定位的用途: 1.图片的叠加 2,元素的垂直居中 3.布局位置的改变 4,广告植入

7.html中link标记允许当前文档和外部文档之间建立连接,但是只能在head标签里面用。href设置或获取目标=URL ,rel设置或获取对象和链接目的的关系,type设置或获取对象的 MIME 类型,media设置或获取媒体类型。 all 就表示all所有媒体类型的样式。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,902评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,037评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,978评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,867评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,763评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,104评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,565评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,236评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,379评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,313评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,363评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,034评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,637评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,719评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,952评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,371评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,948评论 2 341

推荐阅读更多精彩内容

  • 一、CSS入门 1、css选择器 选择器的作用是“用于确定(选定)要进行样式设定的标签(元素)”。 有若干种形式的...
    宠辱不惊丶岁月静好阅读 1,578评论 0 6
  • 当在这一个页面上实现布局和定位有几种不同的技术。使用哪种技术,很大程序上取决于内容和目标页面,因为有很多技术比别人...
    lulu_c阅读 1,033评论 0 5
  • CSS的position总是属性很容易让人弄混~ 为了仔细区别它们,所以今天总结一下CSS的position属性~...
    fehysunny阅读 2,907评论 0 7
  • CSS 是什么 css(Cascading Style Sheets),层叠样式表,选择器{属性:值;属性:值}h...
    崔敏嫣阅读 1,469评论 0 5
  • 【捭阖第一】 (1.2)变化无穷,各有所归,或阴或阳,或柔或刚,或开或闭,或驰或张。是故圣人一守司其门户,审察其所...
    猎人2016阅读 583评论 0 0