css基础知识
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。其中选择器通常是您需要改变样式的 HTML 元素(比如p标签),也可以是节点的属性的值(比如id,class);每条声明都是一条字典key:value,以分号(;)分隔;例如p {color:red;text-align:center;}。
CSS的使用:
1.内部样式表: 写在<head>标签里的<style>标签里。<head><style>body {background-color:green}</style></head>
2. 外部样式表:也可以放在css文件里。然后使用link或import。<head><link rel="stylesheet" href="wcss.css" type="text/css" /><head>或者<head><style>@import url(wcss.css)</style></head>
3. 内联样式:写在标签里。<div style="font-size:14px; color:#FF0000">
最好是用方式2的link
CSS的注释使用的不是html的<!-- -->注释,而是java的/* */注释。
head:
<style>
#center_red{text-align:center;color:red;} 只能被id=center_red的标签引用
.center_green{text-align:center;color:green} 只能被class=center_green的标签引用。在.之前加上页面标签则表示只能在这个标签里用,比如p.center_green就只能对class为center_green的p标签生效
</style>
body:
<p id="center_red">试试css的id</p> 在<a>里面不行
<p class="center_green">试试css的class</p>
注意:如果一个标签既被内部样式表定义、又被外部样式表定义。那么取内部样式表的定义,然后取外部样式表中声明list中key不存在内部样式表声明list中的key:value。 既。外部样式h3{color:red;text-align:left;} 内部样式h3{text-align:right;font-size:20pt;} 那么最终h3的样式为{color:red;text-align:right;font-size:20pt;}. 优先级顺序是内联、内部、外联、浏览器缺省设置。
css基础知识的更多相关文章
- 前端开发:css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- CSS基础知识之float
前段时间写过一篇CSS基础知识之position,当时对float的理解不太准确,被慕课网多名读者指出(原文已修正,如有误导实在抱歉).现对float进行更深入的学习,在此把学习心得分享给大家. 浮动 ...
- (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...
- CSS基础知识之position
最近在慕课网学习了 网页布局基础 和 固定层效果 ,都是由声音甜美的 婧享人生 老师所录制,视频详细讲解了CSS中position的用法,在此把学习笔记分享给大家. CSS定位机制 标准文档流(Nor ...
- 【CSS】 CSS基础知识 属性和选择
css基础知识 html的基本标签都是千篇一律的,为了能够个性化外观,就需要进行样式的调整,而css就是专门用来维护,管理样式的一种格式.在html中定义css有三种方法 1. 为标签添加style属 ...
- CSS基础知识01
一.CSS基础知识介绍 1.css是cascading style sheet层叠式样式表的简写 2.css小用法 加粗:font-weight:bold; 正常用:norma ...
- 〖前端开发〗HTML/CSS基础知识学习笔记
经过一天的学习,把慕课网的HTML/CSS基础知识学完了,笔记整理: 1. 文件结构: HTML文件的固定结构: <html> <head>...</head> & ...
- Web学习篇之---css基础知识(一)
css基础知识(一) 1.css样式: 载入css样式有下面四种: 1).外部样式 2).内部样式 3).行内样式 4).导入样式 <link href="layout.css&quo ...
- DIV+CSS专题:第一天 XHTML CSS基础知识
欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础 ...
- HTML+CSS基础知识(2)选择器的使用、盒子模型的讲解、列表的使用
文章目录 1.CSS基础知识 2.css样式 2.1.代码: 2.2 测试结果 3.CSS的语法 3.1 代码 4.块元素和行内元素 4.1 代码 4.2 测试结果 5.常用的选择器 5.1 代码块 ...
随机推荐
- Angular2 指令
1. 指令说明 Angular2 指令是构成Angular2应用程序的重要组成部分,指令主要用来对模板的标签或者元素附加一些新的特性或者功能,改变一个 DOM 元素的外观或行为,Angular2指 ...
- 【XLL 框架库函数】 TempActiveColumn/TempActiveColumn12
创建一个包含所有激活工作表列的 XLOPER/XLOPER12 LPXLOPER TempActiveColumn(BYTE col); LPXLOPER12 TempActiveColumn12(C ...
- Windows下安装Redis
1.首先,Redis官方是支持Linux系统的,我这里不多说,需要的可以参考:http://www.oschina.net/question/12_18065/ 2.Windows 64位下载地址:h ...
- 《图形学》实验五:改进的Bresenham算法画直线
开发环境: VC++6.0,OpenGL 实验内容: 使用改进的Bresenham算法画直线. 实验结果: 代码: //中点Bresenham算法生成直线 #include <gl/glut.h ...
- jquery插件开发继承了jQuery高级编程思路
要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈 ...
- HDU5880 Family View(2016青岛网络赛 AC自动机)
题意:将匹配的串用'*'代替 tips: 1 注意内存的使用,据说g++中指针占8字节,c++4字节,所以用g++交会MLE 2 注意这种例子, 12abcdbcabc 故失败指针要一直往下走,否则会 ...
- Spring Bean后处理器以及容器后处理器【转】
Bean后处理器:即当spring容器实例化Bean实例之后进行的增强处理. 容器后处理器:对容器本身进行处理,并总是在容器实例化其他任何Bean之前读取配置文件的元数据并可能修改这些数据. 一.Be ...
- 2016 Multi-University Training Contest 4
6/12 2016 Multi-University Training Contest 4官方题解 KMP+DP A Another Meaning(CYD) 题意: 给一段字符,同时给定你一个单词, ...
- Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_The49DayPersonalFullscreenGiftModel", referenced from: objc-class-ref in The49DayPersonalRoomGiftModel.o ld: symbol(s) not found for a
Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_The49DayPersonalFullscreenGiftModel&q ...
- win10 install JDK&&JRE
重装系统后,安装的java环境没了,只能重装一下~~~~ 1.下载JDK 2.这里会安装两次,其中第一次为安装 JDK,第二次安装JRE,建议不要将这两个放在同一个文件夹. 3.配置环境变量 用鼠标右 ...