HTML--3css样式表
CSS（Cascading Style Sheet，叠层样式表），作用是美化HTML网页。
/*注释区域*/ 此为注释语法
一、样式表
（一）样式表的分类
1.内联样式表
和HTML联合显示，控制精确，但是可重用性差，冗余较多。
例：<p style="font-size:14px;">内联样式表</p>
2.内嵌样式表
作为一个独立区域内嵌在网页里，必须写在head标签里面。
<style type="text/css">
p //格式对p标签起作用
{
样式；
}
</style>
3.外部样式表
新建一个CSS文件，用来放置样式表。如果要在HTML文件中调用样式表，需要在HTML文件中点右键→CSS样式表→附加样式表。一般用link连接方式。
有些标签有默认的边距，一般写样式表代码的时候都会先去除（也可以设置其他的样式），如下：
<style type= "text/css">
* //格式对所有标签起作用
{
margin：0px;
padding:0px;
}
</style>
（二）选择器
1.标签选择器。用标签名做选择器。
<style type="text/css">
p //格式对p标签起作用
{
样式;
}
</style>
2.class选择器。都是以“.”开头。
<head>
<style type="text/css">
.main /*定义样式*/
{
height:42px;
width:100%;
text-align:center;
}
</style>
</head>
<body>
<div class="main"> <!--调用class样式-->
</div>
</body>
3.ID选择器。以“#”开头。
<div id="样式名">
<head>
<style type="text/css">
#main /*定义样式*/
{
height:42px;
width:100%;
text-align:center;
}
</style>
</head>
<body>
<div id="main"> <!--调用样式-->
</div>
</body>
4.复合选择器
（1）用“，”隔开，表示并列。
<style type="text/css">
p,span /*标签p、span两者同样的样式*/
{
样式;
}
</style>
（2）用空格隔开，表示后代。
<style type="text/css">
.main p /*找到使用样式“mian”的标签，在该标签的p标签使用该样式*/
{
样式;
}
</style>
（3）筛选“，”。
<style type="text/css">
p.sp /*在标签p中的class=“sp”的标签，执行以下样式*/
{
样式;
}
</style>
二、样式属性
（一）背景与前景
1.背景：
2.前景字体：
（二）边界和边框
border（表格边框、样式等）、margin（表外间距）。padding（内容与单元格间距）。
（三）列表与方块
width、height、（top、bottom、left、right）只有在绝对坐标情况下才有用。
链接的style：
a:link 超链接被点前状态
a:visited 超链接点击后状态
a:hover 悬停在超链接时
a:active 点击超链接时
在定义这些状态时，有一个顺序l v h a
HTML--3css样式表的更多相关文章
- 网页制作之html基础学习3-css样式表
样式:CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. 在样式里面用 /* */ 进行注释. 1.样式表的基本概念 1.1.样式表分类 1.内联样式表 和 ...
- CSS样式表分类
1.内联样式表 <p style="font-size:11px;">内联样式表</p> 2.内嵌样式表 写在head标签里 <style typ ...
- 深度理解CSS样式表，内有彩蛋....
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS样式表
CSS样式及属性 样式标的基本概念 样式表的分类 1.内联样式表 和html联合显示,控制精确,但可重用性差,冗余多. 例:<p style="font-size:14px;" ...
- CSS样式表基础
CSS的样式表其实就是美观页面的,加一些样式. 一.样式表的三种分类: ①内联样式:写在某一个标签里面的样式. 优点:控制精确. 缺点:代码重用性差.(太多了不好写)页面代码乱.(太乱,后期不方便看) ...
- 深入理解脚本化CSS系列第四篇——脚本化样式表
× 目录 [1]CSSStyleSheet [2]CSSRule 前面的话 关于脚本化CSS,查询样式时,查询的是计算样式:设置单个样式时,设置的是行间样式:设置多个样式时,设置的是CSS类名.脚本化 ...
- CSS：CSS样式表及选择器优先级总结
我们在写网页的时候经常会遇到同一个HTML文件,使用了外部样式.内部样式以及内联样式,那么如果发生冲突时浏览器是怎么抉择的呢? 也会遇到这样的情况,在样式表中,对同一个HTML元素,我们有可能既用到了 ...
- Qt——浅谈样式表
优秀的程序,不仅要有严密逻辑,而且应该有美观的外表.从软件界面,便可看出你是否用心在做,是否是一个有思想的人. Qt样式表的术语和语法规则和HTML CSS有很多相似之处. 样式规则 Qt中样式规则由 ...
- 3、CCS样式表
一.CCS样式表的分类(优先级从低到高): 1.浏览器默认样式表 2.外部样式表:在外部创建的.ccs文件中.使用外部样式表可以使样式应用于多个网页.通过这个方法只需改动一个文件就能改变整个网站的外观 ...
- html嵌入样式表
1.针对文件中的字体还有属性进行设置主要设置文字的大小及其颜色问题,未涉及div飘操作 处理页面CSS 先检测该内容部分是否已经设定了样式,如果没有单独设定再按照总体设计进行限定. eg: h1 h ...
随机推荐
- 任性，新建对象不用new
先看最简单的一个例子: window.meng = window.meng || {}; (function () { /** * * @param {Number}width * @param {N ...
- CentOS怎样查看系统信息
一.查看系统版本和核心版本 1 登陆CentOS,启动终端. 2 登陆root帐户,输入 cat /etc/redhat-release,即可显示系统版本. 3 输入 uname -r ,可以查询 ...
- Sublime Text 3编辑器安装
一.安装Sublime Text 3 到Sublime Text 3官网下载最新版本:http://www.sublimetext.com/3 一路Next下去即可完成安装.安装完Sublime Te ...
- Python--关于dict
慕课网<Python 入门>学习笔记 1.dict 特性 dict用花括号{}表示,然后按照 key: value, 写出来即可.最后一个 key: value 的逗号可以省略. ①.di ...
- SyntaxError: Non-ASCII character '\xe7' in file解决方法
SyntaxError: Non-ASCII character '\xe7' in file 出现这种错误的原因是程序中的编码出问题了,只要在程序的最前面加上 最前面的意思是在最前面,包括在注释的前 ...
- CentOS 7.x安装配置
简述 VMware可以创建多个虚拟机,每个虚拟机上都可以安装各种类型的操作系统.安装方法也有很多种.下面,主要以ISO镜像安装为例,介绍CentOS 7.x的安装过程及相关的参数设置. 简述 创建虚拟 ...
- 關於my97datepicker
原因的一篇是比較老的版本了 目前使用4.72 目前碰到一種情況就是使用了PopUpForm.js,也就是在頁面中彈出一個框,用來編輯,或者添加數據等功能. 使用知道時間會出現一種情況.時間顯示被ifr ...
- 有关Rander生成随机数的问题
首先我们说的是要生成一个随机数要求传入两个参数.一个表示生成的个数,另外一个表示生成的长度 . public void shengchengsuijishu(int lenght) { '}; Ran ...
- Login 页面
1.jsp <script type="text/javascript"> function doLogin() { if (trim($('#username').v ...
- jQuery_pager.js分页
在做前端项目中,总是需要自己手写类似于这样的分页效果: 这就需要使用jQuery.pager.js文件,其使用方法为:在html中引入三个文件,分别为: <link rel="styl ...