css基础 引用方式 标签选择器 优先级 各式布局

今天讲的css基础,了解了css即层叠式表,是美化网页,控制页面的样式。

样式表引进网页的3种方式1内联式,语法例子:<div style="width: 100px;height: 50px;background: #E91115"> </div>‘

2内嵌式   语法例子  ( head里面)     div{height: 100px;width: 100px;background: #EF0E12}

3外部样式表 语法例子 ( head里面)   <link rel=" stylesheet" href=“ **.css>”

选择器     1标签选择器   标签名{样式}

2ID选择器       #id名{样式  }  (唯一的)

3类选择器       .class名{}样式 } (可给任何加)

4组合选择器     逗号       同时给逗号连接的标签加上样式    例如  p,div{}

空格     列如 OL空格il

筛选     标签名.class名

+

属性选择器   例如 div[ date=" div"]{}

优先级         1在标签内style=“”

2id选择器

3类和属性选择器

4body td.....里面的

5*对于所有的

注意:选择器一样时,下面的样式高于上面的。

格式布局      position:fixed 固定

position:absolu 绝对定位

position:relative 相对定位

语法:position:3种任意一种 ;z-index 10;left或者   right =100px;   top或者   botton=100px

时间: 2024-10-09 21:25:33

css基础 引用方式 标签选择器 优先级 各式布局的相关文章

前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器

前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器 一丶CSS简介 ???叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化 ????特点: ??????1.丰富的样式定义 ,易于使用和修改,多页面应用,页面压缩,层叠 ??????2.使数据和

前端——CSS的引入方式、选择器

前端--CSS的引入方式.选择器 什么是CSS? 层叠样式表(就是用来调节标签的样式) CSS注释 /*单行注释*/ /*多行注释1 多行注释2 多行注释3 */ 注释的使用 css应该是一个独立的文件 /*页面通用样式*/ /*顶部导航栏样式*/ /*侧边菜单栏样式*/ -- css语法结构 选择器 {属性名1:属性值1;属性名2:属性值2;属性名3:属性值3;--} css三种引入方式 外部css文件(最正规的书写方式) /*mycss*/ /*这是一个非常牛逼的页面的css样式文件*/ /

前端开发:css基础知识之盒模型以及浮动布局。

前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西?  为什么这个浮动没有效果?  这个问题楼主已经回答了n遍.今天则是把它写到我的博客中,想知道自己过来翻就好啦 ^_^  下面楼主把当前的自己对css的基础认知一一给大家道来...... 盒模型 谈到盒模型,有经验的小伙伴一定滚瓜烂熟,无非就是 内容(content).填充(padding).边框(border).边界(margin): 这些属性我们可以把它转移到我们

css基础语法一(选择器与css导入方式)

页面中,所有的CSS代码,需要写入到<style></style>标签中.style标签的type属性应该选择text/css,但是type属性可以省略. CSS修改页面中的所有标签,必须借助选择器选中.选择器中,可以写多对CSS属性,用{}包裹: 每个属性名与属性值之间用:分隔,多对属性之间,必须用;分隔.         选择器{                    属性1:属性值1;                    属性2:属性值2;                 

CSS基础学习十一:选择器的优先级

在CSS基础学习的篇章中,从第四篇博客开始说选择器,到昨天基本已经说完了.今天我们总结一下,选择器作 用:告知浏览器需要设置哪个dom元素的样式.最后来说说选择器一个重要的问题,选择器的优先级.判断优先级的 方法就是尝试!!! 一简单选择器的优先级 简单的选择器包括我们在第四篇,第五篇,第六篇博客的元素选择器(标签选择器),类选择器和id选择器. 我们来试验: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&quo

css基础知识学习之选择器

类选择语法如下: .类选择器名称{ 属性名:属性值;}多个属性名:属性值以分号隔开 导入到html文件的cc文件,方法如下1:在<head>..</head>之间使用<line href='path'type='text/css' rel="stylesheet"/>导入之后使用方法如下:<span class=名称>例子:css文件 .str1{ font-size: 20px; background-color: salmon; fo

CSS的引入方式及选择器

CSS的引入方式第一种:在head中 <style></style> 嵌入式第二种:在head中 <link href="index.css" rel="stylesheet"> 链接式 (先加载css,再加载html)推荐第三种:在head中 <style>@import "index.css";</style>> 导入式(先加载html,再加载css)第四种:直接在html标签

CSS基础-引入方法,选择器,继承

一.CSS引入方法:行内式.嵌入式.导入式.链接式. 1.行内式. 即:在标签的style属性中设定CSS样式. 例子:<div style="行内式</div> 2.嵌入式 即:将页面各种元素的设置集中写在<head></head>标签里. 例子: <head> <style type="text/css"> div{ background-color:blue; } </style> </

浅谈CSS,引入方式,选择器

全称Cascading Style sheets ,中文名称:层叠样式表/级联样式表.CSS就是给我们的HTML网页加样式的东西,它可以让我们的html网页变得更加绚丽多彩,它有三种引入方式. 第一种内嵌式:直接写在我们的html标签里面的,如:  <div style="属性:属性值;"> </div>        这就是内嵌也叫嵌入. 第二种内联写法:在我们的html网页里面的head里面添加一个style标记,然后在里面写,如: <head>