`

html布局学习笔记

阅读更多

 

  • <frameset> 定义如何将窗口化分为框架(rows/cols),不能与body同在,否则不显示
  • <frame>  定义框架要加载的html文档,需增加 noresize="noresize"属性防止有可见边框可随意拖动
  • <noframes> 用于不支持框架的浏览器 
综合以上三个标签示例如下:
<html>
<head>
<title>frame框架</title>
</head>

<frame>
<frameset rows="20%,*">
<frame src="top.htm" name="top" noresize="noresize">
<frameset cols="25%,75%">
<frame src="left.htm" name="left" noresize="noresize">
<frame src="main.htm" name="main" noresize="noresize">
</frameset>

<noframes>
<body>
您的浏览器不支持框架!
</body>
</noframes>
</frameset>
</frame>

</html>
  •  所有跟样式有关都要放到单独的样式表.css中,通过link标签放到head标签内,并可引用到多个页面中。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
  • 当定义产生冲突时,CSS新式的生效规则是后定义的优先。优先级的顺序是:
  1. 在标签中加入CSS样式 
  2. 在<style></style>标签中加入css样式
  3. 导入样式@import url("index.css")或@import "index.css"
  4. 链入外部CSS样式表
  • 常用字符实体
结果 描述 实体名称 实体编号
非间断空格 &nbsp; &#160;
< 小于号 &lt; &#60;
> 大于号 &gt; &#62;
& and符号 &amp; &#38;
¢ &cent; &#162;
£ 英镑 &pound; &#163;
¥ 日元 &yen; &#165;
欧元 &euro; &#8364;
§ 小节号 &sect; &#167;
© 版权所有 &copy; &#169;
® 注册商标 &reg; &#174;


  • 什么是WEB标准?WEB标准不是某一个标准,而是一系列标准的集合。网页主要由三部分组成:结构、表现和行为。对应的标准有三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等。这些标准大部分由W3C起草和发布,也有一些是其他标准组织制定的标准,如ECMAScript。
  • XHTML :在HTML4.0的基础上,用XML的规则对其进行扩展,得到了XHTML。建立XHTML的目地就是实现HTML向XML的过渡。XHTML有三种DTD定义:严格的(strict)、过渡的(transitional)和框架的(frameset)
  • 网站重构:通过在HTML文档中使用结构化的标记以及用CSS控制页面表现,使页面的实际内容与表现样式分离的站点的过程。 网站重构的核心就是实现优化的表现层和结构层分离,建立标准的WEB网页。
  • DIV+CSS只是实现WEB标准的技术手段,并不能代表整个WEB标准。WEB标准不仅仅是HTML向XHTML的转换,更重要的信息结构清晰、内容与表现相分离,而DIV+CSS技术能较好地实现这种制作模式。

 

分享到:
评论

相关推荐

    HTML_CSS学习笔记.docx

    基本的HTML操作,来自IMOOC的学习笔记。 1 1. HTML介绍 4 1.1. HTML与CSS的关系 4 1.2. 标签 4 1.3. HTML5文档结构 5 1.4. head标签 7 1.5. body标签 8 1.6. html注释 8 2. HTML5语义化标签 8 2.1. 语义化 8 2.2. ...

    web第二期学习笔记 ,主要是布局,HTML5

    仅供参考 欢迎纠错

    【JQuery学习笔记day11】HTML 布局

    布局 ...虽然我们可以使用HTML table标签来设计出漂亮的布局,但是table标签是不建议作为布局工具使用的 – 表格不是布局工具。 使用 元素 元素是用于分组 HTML 元素的块级元素。 下面的例子使用

    css网站布局实录学习笔记第三部分网页布局与定位

    第三章 CSS网页布局与定位 3.1 div 几乎XHTML中的任何标签都可以用于浮动与定位,而div首当其冲。对于其他标签而言,往往有它自身存在的目的,而div元素存在的目的就是为了浮动与定位。 3.1.1 div是什么 div是XHTML...

    css网站布局实录学习笔记第一部分

    今天开始,认真学习前端技术,哈哈哈~~~加油~~~ 推荐这本《CSS网站布局实录》(第2版)给初级入门选手,虽然这本书年代有点久远,不过很经典。 注明一下:这里讲述的CSS均为CSS 2.0版本。 第一章 Web标准与CSS布局...

    Bootstrap3.0学习笔记之页面布局

    本文主要讲诉了Bootstrap3.0的页面布局,这些标签在HTML中也都存在,小伙伴们理解起来也就比较轻松,也算是复习一下HTML标签吧

    css网站布局实录学习笔记第二部分XHTML与CSS基础

    DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “&lt;a&gt;http://www.w3&lt;/a&gt; .org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;&lt;html xmlns=”&lt;a &gt;http://www.w3.org/1999/xhtml&lt;

    asp学习笔记

    asp基础HTML语言 用来描述网页/网站布局的标签语言 asp.net jsp php 1/必要格式 &lt;html&gt; &lt;head&gt; &lt;title&gt;欢迎来到学习HTML语言&lt;/title&gt; &lt;/head&gt; &lt;body&gt; 123456 &lt;/body...

    毕向东HTML_CSS_JavaScript教程笔记

    基础学习总结,入门必读. 介绍了HTML,CSS布局,以及JS的应用。

    渡一前端html、css、js笔记及学习规划规划.zip

    渡一前端html、css、js笔记及学习规划规划。了解前端概念,掌握编程规 范,学会HTML必用标签并且能 自定义标签,精通css底层原理 熟练使用达成精准化布局,为后 续课程打下坚实的基础;深入浅出ECMASCRIPT 部分,...

    《杰诺Jero-学习笔记》之div+css 第三章

    HTML源码以及板书文档说明

    2-CSS样式学习笔记【适用于入门级别和进阶级别】.doc

    CSS-- Cascading Style Sheets,层叠式样式表。该技术始于1996年,1998年5月,level2(水平) 成为了W3C 的...CSS扩展了HTML的功能,CSS与HTML、脚本相结合,可以更加有效的实现对网页元素的布局、排版和显示效果的控制。

    《杰诺Jero-学习笔记》之div+css 第二章

    HTML源码以及板书文档说明

    《杰诺Jero-学习笔记》之div+css 第一章

    HTML源码以及板书文档说明

    html&css;&JavaScript;基础笔记

    本文是由笔者2011年学习HTML,CSS,JavaScript时编写的学习札记,内容来源于网络以及个人整理。 Html索引 Head中常用的标签 4 Body体上的标签 4 Body体里面的标签 4 1. 锚点标签 4 2. 分割线 5 3. 标题字体 5 4....

    _html+CSS讲解笔记

    通过使用 CSS 我们可以大大提升网页开发的工作效率! 在我们的 CSS 教程中,您会学到如何使用 CSS 同时控制多重网页的样式和布局。 在本教程中,你将学习如何使用 HTML 来创建站点。

    前端开发笔记.docx

    在前端开发的学习和实践过程中,以下是一些重要的笔记内容: HTML(超文本标记语言): HTML是构建Web页面的基础,它描述了页面的结构和内容。笔记应包括常见的HTML标签、元素嵌套规则以及语义化的重要性。 CSS...

    Extjs学习笔记之六 面版

    另外,extjs中还有丰富的布局,可以用来布局Panel。这种方式很像Java的Swing. Panel可以嵌套,可以作为整个页面的框架,也可以作为一个小功能区。前几篇文中用到的FormPanel就是继承自Panel类的。 下面的例子展示了...

    Bootstrap简单表单显示学习笔记

    表单布局 垂直或基本表单 基本的表单结构时BootStrap自带的,创建基本表单的步骤如下: 1、向父&lt;form&gt;元素添加role = “form”; 2、为了获取最佳的间距,把标签和控件放在一个div.form-group中,div放在父...

Global site tag (gtag.js) - Google Analytics