css 介绍

css（层叠样式表）定义如何显示html 元素

当浏览器读到一个样式表，他就会按照这个表对文档进行格式化（渲染）

css语法

css实例

css 注释

注释是代码之母

/* 这是注释*/

css的几种引入方式

行内样式

行内式是标记的的style属性中设定的css样式。不推荐大规模使用。

<p style ="color :red">

内部样式

嵌入式是将css样式集中卸载网页的<head></head>标签对的<style></sty

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        p{

            background-color:#f5f5f5;

        }

    </style>

</head>

<body>

<p> 大鑫鑫是姑姑的大宝贝</p>

</body>

</html>

外部样式

外部样式就是将css写在一个单独的文件中，然后在页面进行引入即可，推荐使用此方式

<link  href ='mystyle.css'  rel='stylesheet' type='text/css'/>

css选择器

基本选择器

元素选择器

 p{color: :"red";}

id选择器

#i1{background-color:red;}

类选择器

.c1{fon-size:14px;

}

p.c1{color:red;

}

注意：

样式类名不要用数字开头，（有的浏览器不认）

标签中的class属性如果有多个要用空格分隔。

通用选择器

前端基础之css的更多相关文章

前端基础：CSS样式选择器
前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...
前端第二篇---前端基础之CSS
前端第二篇---前端基础之CSS 目录一.css介绍二.css语法三.css的几种引入方式四.css选择器五.css属性相关六.盒子模型拓展一.css介绍 CSS(Cascading ...
02 前端基础之CSS
目录前端基础之CSS css简介基本选择器(重要) 组合选择器(重点) 属性选择器分组与嵌套伪类选择器伪元素选择器选择器的优先级字体相关背景属性边框属性 display属性盒子模型 ...
Web前端基础(4):CSS(一)
1. CSS介绍现在的互联网前端分三层: HTML:超文本标记语言.从语义的角度描述页面结构. CSS:层叠样式表.从审美的角度负责页面样式. JS:JavaScript .从交互的角度描述页面行为 ...
2020年12月-第01阶段-前端基础-HTML CSS 项目阶段(一)
品优购项目(一) 目标: 能会引入ico图标能简单看懂网站优化的三大标签能使用字体图标 ( 重点 ) 能说出我们css属性书写顺序 1. 品优购项目介绍项目名称:品优购项目描述:品优购是一个电 ...
前端基础之css样式（选择器）
一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如二.c ...
前端基础之---css
css 介绍 css 规则有两个主要的部分构成 : 选择器 , 以及一条或多条声明. 现在的互联网前端分为三层 : ● HTML :超文本标签机语言,从语义的角度描述页面结构. ● CSS : 层 ...
Web前端基础(5):CSS(二)
1. 盒模型在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和I ...
2021年3月-第02阶段-前端基础-HTML+CSS阶段-Day02
HTML5 第二天一.rotate 2d旋转指的是让元素在2维平面内顺时针旋转或者逆时针旋转使用步骤: 给元素添加转换属性 transform 属性值为 rotate(角度) 如 transfor ...
前端基础系列——CSS规范（文章内容为转载）
原作者信息作者:词晖链接:http://www.zhihu.com/question/19586885/answer/48933504 来源:知乎著作权归原作者所有,转载请联系原作者获得授权. ...

随机推荐

Android gdb so
gdb debug an android application 1.gdb 要有gdbserver 一般模拟器默认装有gdbserver,如2.3.3的模拟器,看一下有没有: D:\Develope ...
mysql-介绍、MySQL部署、数据类型、存储引擎
数据库介绍什么是数据? 数据(data)是事实或观察的结果,是对客观事物的逻辑归纳,是用于表示客观事物的未经加工的原始素材.数据是信息的表现形式和载体,可以是符号.文字.数字.语音.图像.视频等. ...
C++ "#"的作用和使用方法
本系列文章由 @yhl_leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/48879093 1 #和##的作用和使用 ...
安装protobuf可能遇到的问题
下载protobuf-2.3.0: http://protobuf.googlecode.com/files/protobuf-2.3.0.zip http://code.google.com/ ...
PythonCookBook笔记——数字日期和时间
数字日期和时间数字的四舍五入用round函数,指定值和小数位数. >>> round(1.23, 1) 1.2 >>> round(1.27, 1) 1.3 & ...
用Darwin开发RTSP级联服务器(拉模式转发)(附源码)
源码下载地址:https://github.com/EasyDarwin orwww.easydarwin.org 在博客在Darwin进行实时视频转发的两种模式中,我们描述了流媒体服务器对源端音 ...
EasyPusher手机直播编码推送之图像旋转90度后画面重复的问题
本文转自EasyDarwin开源团队开发Holo的博客:http://blog.csdn.net/holo_easydarwin 最初在做EasyPusher手机直播的时候遇到过一个问题:手机竖屏推送 ...
九度OJ 1106：数字之和（基础题）
时间限制:1 秒内存限制:32 兆特殊判题:否提交:2505 解决:1706 题目描述: 对于给定的正整数 n,计算其十进制形式下所有位置数字之和,并计算其平方的各位数字之和. 输入: 每行输入 ...
Liquibase
http://www.liquibase.org/documentation/index.html https://github.com/studygolang/studygolang/tree/ma ...
yum 工作原理
MySQL :: A Quick Guide to Using the MySQL Yum Repository https://dev.mysql.com/doc/mysql-yum-repo-qu ...

前端基础 之css