w3c_html_study_note_5.26
xhtml+css 正确的说法
“DIV+CSS”叫法将网页制作者引入两大误区
【误区一】网页中用了Table，页面就不标准，甚至觉着用Table丢人，Table成为了判定页面是否标准的关键点。
【误区一】认为网页中的DIV标签用的越多越好，甚至有人将页面中所有的标签都替换为DIV，DIV的多少，决定页面标准的程度。
既然是标准页面，标签各干各的活“各司其职”，Table就用来存储数据，DIV就用来构架页面结构 div不是越多越好
W3C标准不是一个标准，而是一系列标准的集合，包含三部分的标准：结构标准、表现标准和动作标准。与结构标准对应的代表语言是xHTML，与表现标准对应的代表语言是CSS，与动作标准对应的代表语言是JavaScript。
当我们将一个成品的网页设计制作成一个静态页面的时候，就要符合前面两种标准，结构标准和表现标准，那么制作出来的页面就是标准页面，用他们相对应的语言来描述这种制作标准页面的技术我们就称之为“xHTML+CSS”！ （静态）
xhtml是一种结构 css就是一种表现 就像人穿衣服 如何去穿 就用到了样式 样式就是 css控制页面的手段也就是 人穿衣服的方式
--------------------------------------------------------------------------华丽丽的分割线--------------------------------------------------------------------------------------------
第一：如何让CSS去控制HTML页面？
有4种样式(方式)，行内样式、内嵌样式、链接样式、导入样式
行内：
<p style="color:#F00; background:#CCC; font-size:12px;"></p>
直接但是后期不好维护
内嵌
内嵌样式就是将CSS代码写在<head></head>之间，并且用<style></style>进行声明，例如：
<head>
<style type="text/css">
body,div,a,img,p{margin:; padding:;}
a{color:#FFF;}
img{float:left;}
#container{width:500px; height:350px; background:url(http://www.w3cfuns.com/static/image/cm/demo/2d121/w3cBg.jpg) no-repeat; position:relative; margin:0 auto;}
#container p{width:380px; height:40px; position:absolute; left:60px; bottom:60px; color:#fff; font-size:12px; line-height:18px; text-align:center; font-family:"微软雅黑", Verdana, Geneva, sans-serif;}
#reg{display:block; width:114px; height:27px; position:absolute; left:191px; bottom:28px;}
</style>
</head>
提供一个公共css代码 但是后期维护还是不太好
链接样式：
链接样式是使用频率最高，最实用的样式，只需要在<head></head>之间加上<link…/>就可以了，如下：
<link type="text/css" rel="stylesheet" href="style.css" />
四种样式的优先级按照“就近原则”：行内样式 > 内嵌样式 > 链接样式 > 导入样式。 同id属性 优先级高的能覆盖低的
记住“<!---->”注释只要出现在CSS和JS里面，那么就是针对浏览器的条件注释。
--------------------------------------------------------------------------华丽丽的分割线--------------------------------------------------------------------------------------------
对页面控制用样式 如果对特定元素 小范围的页面控制就用到了css选择器
单对一，单对多控制 控制的是页面元素
CSS选择器最基本的有四种：标签选择器、ID选择器、类选择器、通用选择器。
标签选择器
个完整的HTML页面是有很多不同的标签组成，而标签选择器，则是决定哪些标签采用相应的CSS样式，比如，在style.css文件中对p标签样式的声明如下：
p{
font-size:12px;
background:#900;
color:;
}
这么做，会使页面中所有p标签的背景都是#900(红色)，文字大小均是12px，颜色为#090(绿色)，这在后期维护中，如果想改变整个网站中p标签背景的颜色，只需要修改background属性就可以了，就这么容易!当然你也可以设置整个页面中所有的div的属性、a链接的属性、span的属性，这么做方便是方便，但是不够灵活，如果页面中除了某个p标签背景不是红色外，其他的都是红色，就不能用这种方法定义了。
ID选择器：
单独定义 针对性
ID选择器在某一个HTML页面中只能使用一次，就像只有一个身份证 (ID)一样，不重复！在页面中使用ID选择器更具有针对性
<p id="one">W3CFuns.com:打造中国Web前端开发人员最专业的贴心社区！</p>
在CSS中定义ID为one的p标签的属性，就需要用到“#”，代码如下：
#one{
font-size:12px;
background:#900;
color:090;
}
这样页面中的某个p就会是CSS中定义的样式。针对“页面中除了某个p标签背景不是红色外，其他的都是红色的”情况，我们就可以用ID选择器单独定义那个背景不为红色的p标签，这样问题就解决了
类选择器：
w3c_html_study_note_5.26的更多相关文章
- CSharpGL(26)在opengl中实现控件布局/渲染文字
CSharpGL(26)在opengl中实现控件布局/渲染文字 效果图 如图所示,可以将文字.坐标轴固定在窗口的一角. 下载 CSharpGL已在GitHub开源,欢迎对OpenGL有兴趣的同学加入( ...
- C#开发微信门户及应用(26)-公众号微信素材管理
微信公众号最新修改了素材的管理模式,提供了两类素材的管理:临时素材和永久素材的管理,原先的素材管理就是临时素材管理,永久素材可以永久保留在微信服务器上,微信素材可以在上传后,进行图片文件或者图文消息的 ...
- grep-2.26 sed-4.2.2 awk-4.1.4 wget-1.18 pcregrep-8.39 pcre2grep-10.22 for windows 最新版本静态编译
-------------------------------------------------------------------------------------------- grep (G ...
- TMS320F28027/26/23/22/21/20芯片解密单片机破解原理！
TMS320F28027/26/23/22/21/20芯片解密单片机破解 TMS320F2802系列芯片解密型号: TMS320F28027F.TMS320F280270.TMS320F28027.T ...
- [.net 面向对象程序设计进阶] (26) 团队开发利器（五）分布式版本控制系统Git——图形化Git客户端工具TortoiseGit
[.net 面向对象程序设计进阶] (26) 团队开发利器(五)分布式版本控制系统Git——图形化Git客户端工具TortoiseGit 读前必备: 接上篇: 分布式版本控制系统Git——使用GitS ...
- 编写高质量代码:改善Java程序的151个建议(第2章:基本类型___建议26~30)
建议26:提防包装类型的null值 我们知道Java引入包装类型(Wrapper Types)是为了解决基本类型的实例化问题,以便让一个基本类型也能参与到面向对象的编程世界中.而在Java5中泛型更是 ...
- 背水一战 Windows 10 (26) - XAML: x:DeferLoadStrategy, x:Null
[源码下载] 背水一战 Windows 10 (26) - XAML: x:DeferLoadStrategy, x:Null 作者:webabcd 介绍背水一战 Windows 10 之 XAML ...
- 新手指南： Linux 新手应该知道的 26 个命令
当你进入了 Linux 的世界,在下载.安装 了某个 Linux 发行版,体验了 Linux 桌面并安装了一些你喜爱和需要的软件之后,应该去了解下 Linux 真正的魅力所在:命令行.每一个 Linu ...
- Java编程中“为了性能”需做的26件事
1.尽量在合适的场合使用单例 使用单例可以减轻加载的负担,缩短加载的时间,提高加载的效率,但并不是所有地方都适用于单例,简单来说,单例主要适用于以下三个方面: (1)控制资源的使用,通过线程同步来控制 ...
随机推荐
- php操作mysql总结
01 <?php02 $dbhost='localhost';03 $dbuser='root';04 $dbpass='123456';05 $dbname='pro ...
- Redhat/Centos6.x-Samba配置
安装: yum -y install samba samba-common samba-client 设置samba帐号 useradd smb passwd smb smbpasswd -a smb ...
- 远程连接postgres，出现server doesnt listen
已修改pg_hdb.conf中的 # IPv4 local connections: host all all 127.0.0.1/32 ...
- AndroidStudio中gradle异常：unexpected end of block data
原因:可能是Android buildTools版本不够高. 解决方法:打开build.gradle,将android中buildToolsVersion改为'20.0.0' (我使用的是gradle ...
- 用Windows API函数（CreateFile/ReadFile/WriteFile/CloseHandle）完成文件拷贝程序(初级版)
文件拷贝程序 程序类型:Console 参数:源文件名 目的文件名 要求:1.只能使用Windows API函数(CreateFile/ReadFile/WriteFile/CloseHandle ...
- Spring配置文件web.xml关于拦截
1.<!-- 加载springMVC --><servlet><servlet-name>dispater</servlet-name><serv ...
- width100%，设置padding或border溢出解决方法
.box { width: 100px; height: 100px; background: red;} .bd { width: 100%; padding: 10px; background: ...
- DWZ前端框架使用问题记录
心得体验:DWZ依赖特定的HTML结构,所以一定要注意项目中的HTML结构,多用firebug查看,还有如果使用一些组件的时候出现问题,可以查看下返回JSON格式是否符合组件规定的JSON格式,很多都 ...
- PHP -Session 深入解剖 ① session的基本操作 【大成出品 --必是精品】。
Session的初步介绍 1 Session是服务器端技术,利用这个技术,服务器在运行时可以为每一个用户的不同浏览器(一个用户的不同浏览器将生成不同的session文件)创建一个其独享的sessio ...
- ipc telnet 攻击
ping %1 -n 2net use \\%1sc \\%1 config tlntsvr start= autosc \\%1 start tlntsvrtelnet %1