样式表三种写法

1内联写法：style直接写在标签内。个人感觉多用于个别标签，一般情况优先级较高

style="font-size:16px;"

2内嵌写法：写在<head></head>标签内。个人感觉多用于较多或通用的一类标签，用来减少工作量

<style type="text/css">

{}

</style>

分为三种：

标签选择器

<style type="text/css">

标签名（类如div）{ }

</style>

类选择器

<style type="text/css">

.class{}

</style>

id选择器

<style type="text/css">

#id{ }

</style>

特别的

*表示对所有元素起作用

<style type="text/css">

*{

}

</style>

三种复合选择器

并列，用,

<style type="text/css">

标签名,#id{

}

</style>

子代，用空格

<style type="text/css">

table td{

}

</style>

筛选，用.

<style type="text/css">

牌

p.sp{

}

</style>

3外部样式表

<Link rel="stylesheet" type=‘text/css‘"href=’’"/>

这里用href

常用属性

1· 背景与前景

background-color:;背景色，

background-image:url(); 设置背景图片

background-attachment:fixed; 背景固定

background-repeat:no-repeat; 不平铺

background-position:center;背景图居中，设置背景图位置时，repeat必须为no-repeat

2字体

font-family:字体

color:文字颜色

font-size:18px; 字体大小（12px，14px，18px）

font-weight:normal;bold加粗

font-style:italic; 倾斜

text-decoration:overline; 下划线

text-align:center; (水平)居中对齐

vertical-align:middle; (垂直)居中对齐；与行高同用

line-height:行高

3边界与边框

border:5px solid red; 红色，5像素

margin:50px; 外边框宽度50像素

margin-top:50px; 上边外边框宽度50像素

margin:20px 0px 20px 0px; 顺序：上右下左，时钟顺时针顺序

padding:50px; 内间距50像素

padding-top:50px; 内上边框50像素

padding:50px 20px 10px 20px; 顺序为上右下左，时钟顺时针顺序

第一周复习二 （CSS样式表及其属性）的更多相关文章

  1. css样式表及属性

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/    此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...

  2. 为什么有时候Css样式表某个属性引用不成功？

    首次使用博客,很多东西都在探索,第一篇文章也不知道发布点什么,就随便写写,是在word里面写的,也懒得排版,将就这用吧. 闲着没事找了酷狗的API写了个简单的静态网页,完成了搜索,展示,播放功能.就想 ...

  3. 第一周复习一 （ HTML表单form）

    form <from id="" name="" method="post/get" action="">& ...

  4. CSS样式表------第一章：样式表的基本概念

    CSS(Cascading Style Sheets,层叠样式表),控制页面样式外观,作用是美化HTML网页. 一. 样式表的基本概念 1.样式表的分类 (1)内联样式表  -----放在元素的开始标 ...

  5. 【2017-03-24】CSS样式表

    CSS样式表:层叠式样式表 一.样式表的分类 1.内联式 写在标记的属性位置,优先级最高,重用性最差. 格式: <div style="width:100px;height:100px ...

  6. WEB入门 四 CSS样式表深入

    学习内容 Ø        CSS选择器深入学习 Ø        CSS继承 Ø        CSS文本效果 Ø        CSS图片效果 能力目标 Ø        掌握CSS选择器的组合声 ...

  7. WEB入门三 CSS样式表基础

    学习内容 Ø        CSS的基本语法 Ø        CSS选择器 Ø        常见的CSS样式 Ø        网页中3种使用CSS的方式 能力目标 Ø        理解CSS的 ...

  8. CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器

    CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...

  9. 深度理解CSS样式表，内有彩蛋....

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. git提交时，仓库是空的，本地有源码。

    应该打开cmd   归到项目路径 然后输入git push -u origin master -f 是把本地的项目强制推送到空的仓库 git init (在当前文件夹下初始化一个git仓库) git ...

  2. javaIO流(二)--字节流与字符流

    一.流的基本概念 在java.io包中,File类是唯一一个与文件本身有关的程序处理类,但是File类只能操作文件本身,而不能操作文件内容,IO操作的核心意义在于输入和输出操作.而对于程序而言,输入和 ...

  3. 解惑结构体与结构体指针(struct与typedef struct在数据结构的第一道坎)

    /* 数据结构解惑01  在数据结构中会看到 typedef struct QNode { QElemType data; //数据域 struct QNode *next; //指针域 }QNode ...

  4. RabbitMq--3--案例

      https://blog.csdn.net/hellozpc/article/details/81436980

  5. 44.和为S的两个数字

    题目描述:   输入一个递增排序的数组和一个数字S,在数组中查找两个数,使得他们的和正好是S,如果有多对数字的和等于S,输出两个数的乘积最小的. 思路分析:   数组是递增排序的,我们先将数组遍历一遍 ...

  6. C#反射的实现

    一,什么是反射? 1,System.Reflection 命名空间中的类与 System.Type 使你能够获取有关加载的程序集和其中定义的类型的信息,如类.接口和值类型. 可以使用反射在运行时创建. ...

  7. javascript基础7（正则及表单验证）

    1.正则的概念     JS诞生的目的是什么?     就是为了做表单验证.       在JS未出现以前,表单的信息验证需要传输给后台,让后台做数据验证处理之后,再返回给前端页面处理的结果.在带宽有 ...

  8. SET CONSTRAINTS - 设置当前事务的约束模式

    SYNOPSIS SET CONSTRAINTS { ALL | name [, ...] } { DEFERRED | IMMEDIATE } DESCRIPTION 描述 SET CONSTRAI ...

  9. 三、Centos7安装Mysql

    1.到服务器下载的链接 wget https://dev.mysql.com/get/mysql57-community-release-el7-11.noarch.rpm 2.执行命令 sudo r ...

  10. java 方法的定义与调用

    /* 定义一个方法的格式: public static void 方法名称(){ 方法体 } 方法名称的命名规则和变量一样,使用小驼峰 方法体:也就是大括号里面的可以包含任何语句 注意事项: 1.方法 ...