html嵌入样式表
1.针对文件中的字体还有属性进行设置主要设置文字的大小及其颜色问题,未涉及div飘操作
处理页面CSS 先检测该内容部分是否已经设定了样式,如果没有单独设定再按照总体设计进行限定。
eg: h1 h2 h3 h4 h1,h2,h4{} body{} 类似实例
css for select beyong the relation to select
派生类选择器for: <ul><li><strong > css li strong{};
id选择器:#id #demo
类选择器 .class .check{}
属性选择器 <p name=""> [name]{}
2.
3.添加背景图片 background-image:url('../image/jkzhang.jpg');
html当读到样式表时,浏览器会根据它来格式化HTML文档,常用的两种方法:
1.外部样式表
2.内部样式表
1.外部样式表。当多个页面需要使用同一个样式,可以采用。常用格式:
<head>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
HTML网页根据stylesheet.css读到的约束来格式化网页
约束:外部样式表中不能包括任何HTML标签
h1,h2{
color:red;
margin:2cm 2cm 3cm 3cm};
hr{color:green};
body{background-image:url("");}
2内部样式表:直接在单一网页应用样式表
<head>
<style type="text/css">
h1,h2{
color:red;
margin:2cm 2cm 3cm 3cm
}
hr{color:green}
body{background-image:url("");}
</style>
</head>
注:内部样式表优先级高于外部样式表。当有重合时,先选择内部样式表规定的属性,再添加内部样式表没有的外部样式表的属性。综合才为最终结果。
<html>
<head>
<!--外部样式表 -->
<link rel="stylesheet" type="text/css" href="test.css">
</head>
<body>
<h1> make </h1>
<p>next</p>
<p>change</p>
</body>
</html>
<!-- 外部样式表代码 -->
h1{
color:red;
margin:2cm 2cm 3cm 2cm;
font-size:20px;
}
hr{
color:#ff000;}
p{
color:green
}
body{
background-color:yellow;
background-image:url("");
}
<!-- 内部样式表写法 -->
<html>
<head>
<style type="text/css">
h1{
color:red;
margin:2cm 2cm 3cm 2cm;
font-size:20px;
}
hr{
color:#ff000;}
p{
color:green;
}
body{
background-color:yellow;
background-image:url("");
}
</style>
</head>
<body>
<h1> make </h1>
<hr >
<p>next</p>
<p>change</p>
<hr>
</body>
</html>
<html>
<head>
<style type="text/css">
div#container{
width:500px;}
div#header{
width:500px;
height:50px;
background-color:#99bbbb}
div#menu{
width:150px;
height:200px;
background-color:yellow;
float:left}
div#content{
width:350px;
height:200px;
background-color:red;
float:left}
div#bottom{
background-color:green;
width:500px;
text-align:center
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>Main Title of Web Page</h1>
</div>
<div id="menu">
<h2>Menu</h2>
<ul>
<li>HTML</li>
<li>HTML</li>
<li>HTML</li>
</ul>
</div>
<div id="content">
<h3>Content goes here</h3>
</div>
<div id="bottom">
<h4> copyright</h4>
</div>
</div>
</body>
</html>
html嵌入样式表的更多相关文章
- css样式表的知识点总结
css总的来说有三种css样式可供选择: 1,行内样式表 行内样式表,直接写在了html文件的元素中,例如: <div style="color:red;"></ ...
- Javascript高级编程学习笔记(51)—— DOM2和DOM3(3)操作样式表
操作样式表 在JS中样式表用一种类型来表示,以便我们在JS对其进行操作 这一类型就是CSSStyleSheet 即CSS样式表类型,包括了之前 style 对象所不包括的外部样式表以及嵌入样式表 其中 ...
- 应用CSS样式表
首先应该分清楚应用CSS样式表到HTML页面中和将css样式表绑定到HTML页面的对象,是两个不同的概念.像之前说的通过不同的选择器将样式表绑定到HTML页面中的对象,但其实使用的都是同一种方法应用c ...
- CSS 四种样式表 六种规则选择器 五种常用样式属性
新的html程序要在VS中编写了,在vs中安装ASP.NET和Web开发,并用ASP.NET Web 应用程序(.NETFramework)创建一个网页程序.添加一个html页 后面的代码都是在htm ...
- css样式表分类、选择器分类、css基础样式
1 . 样式表 Cascading Style Sheet css优势: 内容与表现分离 网页的表现统一,容易修改 丰富的样式,使网页布局更加灵活 减少网页代码量,增加网页的浏览速度,节省 ...
- 9月9日HTML上午表单元素2(框架、样式表)
五.框架 1.frameset是双标签框架集,如果使用框架集,当前页面不能有body. frameset属性:①cols代表左右拆分.cols=“300,*”表示左边框架宽300,右边宽剩余的宽度.* ...
- Qt StyleSheet样式表实例(转)
QT论坛看到的,收藏一下! 在涉及到Qt 美工的时候首先需要掌握CSS 级联样式表. 下面将通过几个例子来介绍一下怎样使用Qt中的部件类型设计.自定义的前台背景与后台背景的颜色: 如果需要一个文本编辑 ...
- 图解 CSS: 理解样式表的逻辑(转载)
原文:http://www.cnblogs.com/del/archive/2009/02/01/1382141.html 样式表可以是外部的.内联的或嵌入的; 链接外部样式文件一般是:<lin ...
- CSS样式表优先级
使用CSS样式表一共有2种方式:内部和外部,其中内部分为行内样式和嵌入式,外部分为导入式和链接式. 如果需要在不同的方式中设定同一个属性的时候,样式的优先级别就出现了. 测试代码如下: red.css ...
随机推荐
- POJ3160 Father Christmas flymouse[强连通分量 缩点 DP]
Father Christmas flymouse Time Limit: 1000MS Memory Limit: 131072K Total Submissions: 3241 Accep ...
- idea如何设置类头注释和方法注释
CSDN 2016博客之星评选结果公布 [系列直播]算法与游戏实战技术 "我的2016"主题征文活动 详细:idea如何设置类头注释和方法注释 标签: idea ...
- codevs 2894 保留小数
时间限制: 1 s 空间限制: 128000 KB 题目等级 : 白银 Silver 题目描述 Description 给你一个实数,小数点后不超过50位,请你保留到小数点后n位(四舍五入!!!) 输 ...
- IIS部署SSL,.crt .key 的证书,怎么部署到IIS,记录一下,以免忘记。
SSL连接作用不说,百度很多.因为最近想考虑重构一些功能,在登录这块有打算弄成HTTPS的,然后百度了,弄成了,就记录一下,以便以后万一部署的时候忘记掉. 做实验的时候,拿的我个人申请的已经备案的域名 ...
- 拿什么拯救你,我的代码--c#编码规范实战篇
此文为译文,原文地址请点击. 本文通过重构一个垃圾代码,阐述了如何写出优秀的代码.开发人员及代码审核人员需按照此规范开发和审核代码.此规范以C#为例,JAVA的童鞋一并参考,C++的童鞋自行脑补吧. ...
- 通过COOKIE欺骗登录网站后台
1.今天闲着没事看了看关于XSS(跨站脚本攻击)和CSRF(跨站请求伪造)的知识,xss表示Cross Site Scripting(跨站脚本攻击),它与SQL注入攻击类似,SQL注入攻击中以SQL语 ...
- mysql服务器监控参数总结
1)主机健康监控:网络通信.软硬件错误.磁盘空间.内存使用 2)mysql健康监控: 服务端口(telnet尝试连接).mysqld和mysqld_safe进程.errorlog和复制状态 3)主机性 ...
- 项目分析_xxoo-master
项目介绍:使用java1.5的原生xml操作类实现 对象<-->xml字符串的相互转化 项目分析:主要分为是三个部分 1.容器类:AbstractContainer 存储x ...
- 【BZOJ 4561】【JLOI 2016】圆的异或并
http://www.lydsy.com/JudgeOnline/problem.php?id=4561 一开始并不会做,后来看题解看懂了. 看懂了之后还是错了好几次,数组大小手残开小了. 圆的包含并 ...
- hadoop在网页客户端的maven配置
hadoop网页客户端maven配置,只能在tomcat7上运行,tomcat6和tomcat8运行会出错,我用的是tomcat-7.0.67 完整的pom.xml内容为: <!-- 这个配置只 ...