CSS设计指南之一 HTML标记与文档结构

HTML标记与文档结构之所以从HTML讲起,是因为CSS的用途就是为HTML标记添加样式. 1.1 HTML标记基础对于每个包含内容的元素,根据它所包含的内容是不是文本,有两种不同的方式给它们加标记,一种是使用闭合标签,另一种是使用自闭合标签. 1.1.1 文本用闭合标签 <标签名属性1="属性值">文本内容</标签名> 标题.段落等文本元素都要求闭合标签,也就是要有一个开标签和一个闭标签. 比如:<p>Words by Paul</p&…

CSS 基础：HTML 标记与文档结构(1)<思维导图>

这段时间利用一下间隙时间学习了CSS的基础知识,主要目的是加深对CSS的理解,虽然个人主要工作基本都是后台开发,但是个人觉得系统学习一下CSS的基础还是很有必要的.下面我学习CSS时做的思维导图(全屏查看:HTML 标记与文档结构<思维导图>): 参考资料:<CSS设计指南(第二版)>…

WEB笔记-1、HTML 标记与文档结构

1.HTML 标记与文档结构 1.1 块级(block)和行内(inline)标签块级标签 <h1>-<h6> : 6级标签,h1表示最重要(h1 不仅仅是最大最突出的标题,搜索引擎也将其视为仅次于<title> 标签的另一个搜索关键词的来源) <p>: 段落 <ol>: 有序列表 <li>: 列表项 <blockquote>: 独立引用行内标签 <a>: 连接(anchor,锚) <img&…

《CSS 设计指南》学习笔记一

本篇文章是对这几天看完 Charles Wyke-Smit 的 <CSS 设计指南> 后的一些学习笔记与心得,笔者好像是大一的时候开始接触网页设计,由于并不是计算机专业的,所以所有都是自己自学的,记得当时自己对 CSS 基本上什么都不懂,甚至连怎么在 CSS 中选择某个 class 和 id 都不懂,然后就直接下载一些源码来看,后来看到这些 CSS 文件中有 . 和 # ,然后就连蒙带猜的学会了怎么使用它们,然后就在源码中看到什么不懂的就直接上 W3School 中查找 API,这样也慢慢的让…

CSS 设计指南(第3版) 初读笔记

第1章 HTML标记与文档结构关于<title>标签:搜索引擎会给<title>标签中的文字内容赋予很高的权重.而且这些文字也会作为网页标题出现在搜索结果列表中. 无论你想了解哪个HTML元素,第一个要问的问题都应该是:它是块元素,还是行内元素? Firefox Web Developer组件. 通过HTML标记来构建DOM,然后在页面初次加载和用户与页面交互时,使用CSS来修改DOM. 第2章 CSS工作原理 CSS注释使用/* */,HTML注释使用<!-- --&g…

CSS设计指南之浮动与清除

原文:CSS设计指南之浮动与清除浮动意思就是把元素从常规文档流中拿出来,浮动元素脱离了常规文档流之后,原来紧跟在其后的元素就会在空间允许的情况下,向上提升到与浮动元素平起平坐. 一.浮动 CSS设计float属性的主要目的,是为了实现文本绕排图片的效果.然而,这个属性也成为了创建多栏布局最简单的方式. 1.文本绕排图片在浮动一张图片或其他元素时,你是在要求浏览器把它往上方推,直到它碰到父元素的内边界.后面的段落不再认为浮动元素在文档流中位于它的前面了,因为它会占据父元素左上角的位置.不过,它…

CSS设计指南之定位

原文:CSS设计指南之定位 CSS布局的核心是position属性,对元素盒子应用这个属性,可以相对于它在常规文档流中的位置重新定位.position属性有4个值:static.relative.absolute.fixed.默认值为static. 一.定位类型 1.静态定位static 在静态定位的情况下,每个元素都处于常规文档流中.它们都是块级元素,所以就会在页面中自上而上的堆叠起来. 2.相对定位到底相对哪里定位呢,相对的是它原来在文档流中的位置(或者说是默认位置). 要注意,除了这个元…

CSS设计指南之理解盒子模型

原文:CSS设计指南之理解盒子模型一.理解盒模型每一个元素都会在页面上生成一个盒子.因此,HTML页面实际上是由一堆盒子组成的.默认情况下,每个盒子的边框不可见,背景也是透明的,所以我们不能直接看到页面中盒子的结构.使用WebDeveloper工具条中的"OutLine"->"OutLine Level Element"菜单项,可以方便地显示盒子的边框和背景,从而让我们能从另外一个角度来审视页面的构成. 1.1 元素盒子的属性 1.边框(border):可…

重温CSS之文档结构

我们来看看几个基本的HTML页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equ…

HTML5的文档结构和新增标签

一．HTML5 文档结构1.第一步:打开开发工具,打开指定文件夹:2.第二步:保存 index.html 文件到磁盘中,.html 是网页后缀:3.第三步:开始编写 HTML5 的基本格式.<!DOCTYPE html> //文档类型声明<html lang="zh-cn"> //表示 HTML 文档开始.1. <head> //包含文档元数据开始<meta charset="utf-8"> //声明字符编码<…

HTML5的文档结构

HTML5的文档结构 HTML5简化了许多,它的设计遵循了3个原则:1.兼容性.2.实用性.3.通用访问性 1. header 元素 <header> 标签定义文档或者文档的一部分区域的页眉,又可用于设置文章标题. <header> 元素应该作为介绍内容或者导航链接栏的容器. 在一个文档中,您可以定义多个 <header> 元素. 注释:<header> 标签不能被放在 <footer>.<addre…

html 初识文档结构常用标签

HTML初识 △HTML: 超文本标记语言,是一种用于创建网页的标记语言,不是编程语言,没有逻辑本质上是浏览器可识别的规则我们按照规则写网页,浏览器根据规则渲染我们的网页.对于不同的浏览器,对同一个标签可能会有不同的解释.(兼容性问题) 网页文件的扩展名:.html或.htm(没有区别) 网页文件的扩展名:.html或.htm(没有区别) 我们按照规则写网页,浏览器根据规则渲染我们的网页.对于不同的浏览器,对同一个标签可能会有不同的解释.(兼容性问题) 网页文件的扩展名:.html或.htm…

HTML的文档结构与语法（一）

一.走进Web开发 Web运行的原理: 二.HTML 1.1什么是html HTML是用来描述网页的一种语言 HTML指的是超文本标记语言(Hyper Text Markup Language) 超文本就是网页上不光有文本,还有图片,音乐,视频等标记语言是一套标记标签(markup tag) div,span,font,i等标记 HTML使用标记标签来描述网页 HTML文档包含了HTMl标签及文本内容 HTML文档也叫WEB页面 HTML的主要目的:通过一系列标签,来显示网页的不同效果,不同部…

MongoDB学习笔记(四) 用MongoDB的文档结构描述数据关系

MongoDB的集合(collection)可以看做关系型数据库的表,文档对象(document)可以看做关系型数据库的一条记录.但两者并不完全对等.表的结构是固定的,MongoDB集合并没有这个约束:另外,存入集合的文档对象甚至可以嵌入子文档,或者“子集合”.他们最终都可以用类似于BJSON的格式描述.我们今天就来分析MongoDB这一特性带来的独特数据管理方式.我们还是以samus驱动为例来分析,samus驱动支持两种方式访问数据库,基本方式和linq方式,基本方式在上篇以介绍过,linq方…

HTML文档结构

下面对HTML文档结构进行一一解释: 1.文档声明:既不是元素,也不是注释: 代码格式:<! DOCTYPE html> 注:必须写在HTML文档的第一行原因:告诉浏览器使用哪个版本的HTML进行解析,如果不写,浏览器也会进行解析,在渲染页面时会进入怪异模式: 2.html元素:该元素也叫根元素.根标记,它是所有元素的祖元素,且文档中的所有元素都必须放在它的元素内容中相关属性:lang是英语language的缩写,意思是语言,”en”代表英语,”zh-CN”代表中文. 打开…

HTML的概念和三大基石以及标准文档结构

HTML的概念: 概念: HTML:超文本标记语言作用: 需要将java在后台根据用户请求处理的请求结果在浏览器中显示给用户. 在浏览器中数据需要使用友好的格式展示给用户. HTML是告诉浏览器接收到的数据使用什么样的数据组织形式进行显示使用: HTML的文档规范 HTML的标签---------------------------------------------------------------------------------------------------互联网…

4. svg学习笔记-文档结构元素和样式的使用

svg除了绘图元素之外还有一部分是专门用于文档结构的,这类元素有<g>,<use>,<defs>,<symbol>等 <g>元素如果我们仅仅用于学习svg的时候可能不太会用到<g>元素,但当我们绘制特别复杂的图形的时候<g>元素可配上大用场.<g>元素的作用就是将其子元素作为一个组合,以备将来的复用.可以通过为<g>元素添加<title>子元素来为组合添加标题,详细的描述可以放在<…

Word 2010 制作文档结构之页码从正文开始设置

一般技术性文档结构划分: 第一页(首页) 第二页(修改记录页/版本记录页) 第三页(目录) 第四页(正文) 需求: 页脚编码从正文(即第四页)开始,而不是从首页开始,那么该如何实现? 前提准备: 输入文档内容: 第一页和第二页内容: 第三页和第四页内容: 实现步骤: 一. 1.首先将鼠标放置在第三页(目录页) 的末尾 2.使用“分节符” 页面布局--分隔符--分节符--下一页操作后,发现光标自动跳转到第四页(正文) 的前面,该页也就是“新节”的起始位置,如下: 3.继续上面接着操作,…

前端 HTML文档结构介绍

<!DOCTYPE HTML> <html> <head>...</head> <body>...</body> </html> 解释一下上面的代码: 1.首先,<!DOCTYPE HTML>是HTML文档声明,必须写在HTML文档的第一行,位于<html>标签之前,表明该文档是HTML5文档. 2.<html></html> 称为HTML根标签,所有的网页标签都在<h…

01XML文档结构

文档结构 2.1文档结构 2.1.1文档声明及字符编码 <?xml version=“1.0” encoding=“”gb2312 standalone=“yes”?> <? 告诉指令处理程序这是指令的开始 Xml version=“1.0” 表示该文件遵循XML1.0规范 Encoding=“gb2312” 表示文件可用简体中文编写 Standalone=“yes” 表示没有引用其它文件 ?> 告诉指令处理程序这个指令结束 2.1.2文档注释 <!-- This…

小强的HTML5移动开发之路（42）——HTML4与HTML5文档结构比较

一般来说,人们在书写包括HTML在内的文档时,习惯上按照类似于"章--节--小节"这样的层次结构来进行. 在HTML4中的描述方式: <html> <head> </head> <body> <h1>第一章小强的HTML5移动开发之路</h1> <h2>1.1 HTML5概述</h2> <h3>1.1.1 HTML5是什么?</h3> <h3>1.1.2…

Win 10 开发中Adaptive磁贴模板的XML文档结构，Win10 应用开发中自适应Toast通知的XML文档结构

分享两篇Win 10应用开发的XML文档结构:Win 10 开发中Adaptive磁贴模板的XML文档结构,Win10 应用开发中自适应Toast通知的XML文档结构. Win 10 开发中Adaptive磁贴模板的XML文档结构同样道理,你依旧可以使用8.1时候的磁贴模板,在win 10的API中也是支持的,此外,Win10 App还支持全新的自适应磁贴模板,本文就给大家先讲一下基本结构,下一篇文章中咱们再说一说复杂排版. 应用程序的图标可以分为两类:第一类是应用商店上专用的,就是你的应用提…

Mongodb：修改文档结构后出现错误：Element '' does not match any field or property of class .

Mongodb:修改文档结构后出现错误:Element '***' does not match any field or property of class ***. Mongodb是一种面向文档的数据库,即不再有"行"的概念,取而代之的是更为灵活的"文档"(doucument)模型.在开发中,经常需要变更文档字段,比如添加一个字段等. 这时必须保证每个文档中的字段在实体字段中都有,即实体字段多于各个文档字段(每个文档的字段集合都是实体字段的子集).这样便可保证查…

读取XML文档结构并写入内容

1.在项目中新建XML文档结构.xsd文件,在其中添加相应的节点. 2.读取文档结构并写入内容 string initFileName = @"D:\Config.xml"; DataSet ds = new DataSet(); DataTable dt = new DataTable(); System.Reflection.Assembly asm = Assembly.GetExecutingAssembly(); ds.ReadXmlSchema(asm.GetManifes…

MFC开发上位机到底用Dialog结构还是文档结构？

最近要跟着导师一起开发一款大型上位机.MFC新人在考虑用对话框结构还是文档结构. 虽然说书上说大型结构的软件都需要文档结构,但是目前来看,对话框可以实现功能,并且对话框的程序更小一些,节省资源加载速度也更快. 暂时先考虑对话框结构.后续编程完成后再补充. TBC...…

Poi之Word文档结构介绍

1.poi之word文档结构介绍之正文段落一个文档包含多个段落,一个段落包含多个Runs,一个Runs包含多个Run,Run是文档的最小单元获取所有段落:List<XWPFParagraph> paragraphs = word.getParagraphs(); 获取一个段落中的所有Runs:List<XWPFRun> xwpfRuns = xwpfParagraph.getRuns(); 获取一个Runs中的一个Run:XWPFRun run = xwpfRuns.get(i…

webservice学习01：wsdl文档结构

webservice学习01:wsdl文档结构 wsdl文档结构 WSDL文档示例 <wsdl:definitions xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/" xmlns:tns="http://impl.ws.newyork.zjport.gov.cn/" xmlns:soap="http…

10LaTeX学习系列之---Latex的文档结构

目录目录前言 (一)对于Ctex宏包中的文档结构 1.说明 2.源代码 3.输出效果 4.技巧 (二)对于ctexart的文档结构 1.说明 2.源代码 3.输出效果 (三)对于ctexbook的文档结构 1.说明 2.源代码 3.输出效果目录本系列是有关LaTeX的学习系列,共计19篇,本章节是第10篇. 前一篇:09LaTeX学习系列之---Latex 字体的设置后一篇:11LaTeX学习系列之---LaTeX的特殊字符总目录:19LaTeX学习系列之---LaTeX的总结前言…

java Web开发基础（一）工程项目文档结构

2013年毕业后,在深圳工作开始是用.NET ASP.NET MVC做的项目,后来公司用java来做.于是就从.NET转java了.从.NET转java不是那么的难.今天刚好是清明节放假三天,整理了java web项目的文档结构. 一.Struts2+Spring+Hibernate 项目的文档结构二.Spring MVC+MyBatis项目的文档结构三.Tomcat文档目录结构…

word文档重新打开后文档结构错乱

word文档重新打开后文档结构错乱,然后通过如下方法解决了. OFFICE2007及以上. 在打开word的时候左下角会有提示word自动更新文档样式,按esc键取消,然后在大纲模式下任意增加一行,保存,重新打开就解决了…

【CSS设计指南之一 HTML标记与文档结构】的更多相关文章