样式表三种写法

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. 开启关闭mysql服务

    1.Windows下 启动服务 mysqld --console 或 net start mysql 关闭服务 mysqladmin -uroot shudown 或 net stop mysql   ...

  2. JavaScript 获取function的参数

    function getArgs(func) { // 先用正则匹配,取得符合参数模式的字符串. // 第一个分组是这个: ([^)]*) 非右括号的任意字符 var args = func.toSt ...

  3. BZOJ 4657 (网络流)

    题面 Nick最近在玩一款很好玩的游戏,游戏规则是这样的: 有一个n*m的地图,地图上的每一个位置要么是空地,要么是炮塔,要么是一些BETA狗,Nick需要操纵炮塔攻击BETA狗们. 攻击方法是:对于 ...

  4. 【笔记目录2】【jessetalk 】ASP.NET Core快速入门_学习笔记汇总

    当前标签: ASP.NET Core快速入门 共2页: 上一页 1 2  任务27:Middleware管道介绍 GASA 2019-02-12 20:07 阅读:15 评论:0 任务26:dotne ...

  5. kubernetes里面有时候centos源用不了

    kubernetes里面有时候centos源用不了,快速配一个阿里云的源. mkdir /etc/yum.repos.d/yangback;mv /etc/yum.repos.d/* /etc/yum ...

  6. NSQ消息队列

    前面的总结中提到过这个玩意,所以简单说说,win上面的测试验证 网上有比较合适的博文,我先推荐几篇 https://blog.csdn.net/a2247889821/article/details/ ...

  7. tensorflow 版本的mask rcnn 实践

    1. https://www.jianshu.com/p/27e4dc070761 (tensorflow object detection API/Mask RCNN)

  8. Linux用户的基本操作3 （组的基本管理，用户提权）

    目录 组的基本原理 用户身份切换 5.用户身份提权 组的基本原理 组账户信息保存在/etc/group 和/etc/gshadow 两个文件中. /etc/group组账户信息 [root@zls ~ ...

  9. 三、Centos7安装Mysql

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

  10. Codeigniter项目使用phpDocumentor生成api文档

    前言 运行环境: vagrant 2.2.4 virtualbox 6.0 box bento/ubuntu-16.04 (Apache 2.4.18 + Mysql 5.7.26 + PHP 5.6 ...