html第四节课
css
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页。
/*注释区域*/ 此为注释语法
一、样式表
(一)样式表的分类
1.内联样式表
和HTML联合显示,控制精确,但是可重用性差,冗余较多。
例:<p style="font-size:14px;">内联样式表</p>
2.内嵌样式表
作为一个独立区域内嵌在网页里,必须写在head标签里面。
<style type="text/css">
p //格式对p标签起作用
{
样式;
}
</style>
3.外部样式表
新建一个CSS文件,用来放置样式表。如果要在HTML文件中调用样式表,需要在HTML文件中点右键→CSS样式表→附加样式表。一般用link连接方式。
有些标签有默认的边距,一般写样式表代码的时候都会先去除(也可以设置其他的样式),如下:
(二)选择器
1.标签选择器。用标签名做选择器。
2.class选择器。都是以“.”开头。
3.ID选择器。以“#”开头。
<div id="样式名">
4.复合选择器
(1)用“,”隔开,表示并列。
(2)用空格隔开,表示后代。
(3)筛选“.”。
二、样式属性
(一)背景与前景
1.背景:
2.前景字体:
(二)边界和边框
border(表格边框、样式等)、margin(表外间距)。padding(内容与单元格间距)。
(三)列表与方块
width、height、(top、bottom、left、right)只有在绝对坐标情况下才有用。
链接的style:
a:link 超链接被点前状态
a:visited 超链接点击后状态
a:hover 悬停在超链接时
a:active 点击超链接时
在定义这些状态时,有一个顺序l v h a
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<!--<style type="text/css">
div,p
{
font-size:36px;
color:#90F;
background-color:#0F3;}
</style> -->
<link href="Untitled-3.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="qq">div<p>标签</p></div>
<span style="background-color:#CF3; color:#F00">span层标签</span>
<p>这是一个温暖的春天。</p><p>12345</p>
<a href="http://www.autohome.com/">汽车之家</a>
</body>
</html>
@charset "utf-8";
/* CSS Document */
<style>
*
{
margin:0px;
padding:0px;}
p
{
font-size:36px;
color:#90F;
background-color:#0F3;}
#qq
{
background-color:#00F;
font-size:50px;
color:#F00;}
#qq p
{
background-color:#00F;
font-size:80px;
color:#6F0;}
a:link
{
text-decoration:none;
color:#000;}
a:visited
{
text-decoration:none;
color:#000;}
a:hover
{
color:#F00;
text-decoration:underline;}
a:active
{
text-decoration:underline;
color:#C60;}
</style>
html第四节课的更多相关文章
- centos Linux系统日常管理1 cpuinfo cpu核数 命令 w, vmstat, uptime ,top ,kill ,ps ,free,netstat ,sar, ulimit ,lsof ,pidof 第十四节课
centos Linux系统日常管理1 cpuinfo cpu核数 命令 w, vmstat, uptime ,top ,kill ,ps ,free,netstat ,sar, ulimit ...
- centos 目录文件管理 mkdir,rm,touch,误删文件extundelete,cp,mv,cat,more,less ,head,tail,chown,chmod ,umask 第四节课
centos 目录文件管理 mkdir,rm,touch,误删文件extundelete,cp,mv,cat,more,less ,head,tail,chown,chmod ,umask 第四节课 ...
- 风炫安全web安全学习第三十四节课 文件包含漏洞防御
风炫安全web安全学习第三十四节课 文件包含漏洞防御 文件包含防御 在功能设计上不要把文件包含的对应文件放到前台去操作 过滤各种../,https://, http:// 配置php.ini文件 al ...
- 风炫安全WEB安全学习第二十四节课 利用XSS钓鱼攻击
风炫安全WEB安全学习第二十四节课 利用XSS钓鱼攻击 XSS钓鱼攻击 HTTP Basic Authentication认证 大家在登录网站的时候,大部分时候是通过一个表单提交登录信息. 但是有时候 ...
- 第四节课-反向传播&&神经网络1
2017-08-14 这节课的主要内容是反向传播的介绍,非常的详细,还有神经网络的部分介绍,比较简短. 首先是对求导,梯度的求解.反向传播的核心就是将函数进行分解,分段求导,前向计算损失,反向计算各个 ...
- 《linux就该这么学》第四节课笔记,三章和四章开始!
第三章 (根据课本和在线培训视频排版总结,借鉴请改动) 右键可打开终端练习 3.1:输入输出重定向 输入重定向:符号 "<" ,是一种 ...
- 《linux就该这么学》第十四节课:第13章,部署DNS域名解析服务(bind服务)
(借鉴请改动) 第十二章收尾 12.2.nfs网络文件系统 RHEL7默认安装了nfs,配置文件在 /etc/export 写入格式:共享目录 允许的客户端(参数) ro ...
- C#第十四节课
函数的调用 using System;using System.Collections.Generic;using System.Linq;using System.Text;using System ...
- Linux第四节课学习笔记
touch命令可修改文件atime和mtime,不能修改ctime.可用于修改文件后将修改时间改回之前修改时间. mkdir命令用于创建空白的目录,格式为“mkdir [选项] 目录”.加上参数-p可 ...
- php第二十四节课
三级联动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
随机推荐
- 关于重置IOS App请求推送的授权请求
项目要加入推送通知.測试完本地通知后.发现測不了远程通知.于是想重置授权请求. 下面是重置授权请求的方法: 方法一: 通用->还原->抹掉全部内容和设置 可是第一种方法非常费时,抹掉内容预 ...
- 2.5-冗余VLAN
2.5-冗余VLAN High-Availability(AH) First hop routers on the LAN redundancy Network/首跳冗余网络(出口第一个网络) ...
- eclipse中Client/Server程序生成exe
先建两个Java Project项目,一个写Client,一个写Server端程序,程序大致为一个Server端建立监听某个port.多个Client端能够连接,实现例如以下: 1. Ser ...
- Android Notification状态栏通知
没有添加额外的震动及声音效果,这里直接实现了通知的功能,看效果吧: MainActivity.java package com.example.notification; import android ...
- 详略。。设计模式1——单例。。。。studying
设计模式1--单例 解决:保证了一个类在内存中仅仅能有一个对象. 怎么做才干保证这个对象是唯一的呢? 思路: 1.假设其它程序可以任意用new创建该类对象,那么就无法控制个数.因此,不让其它程序用ne ...
- ubuntu下一款有点感觉的 linux音乐播放器 clementine(小橘子))
https://www.clementine-player.org/ 在linux听音乐的感觉确实不是很好,音乐播放器很多.但是仅仅只是数量上的优势,在确实不是很好用.自带的rhythmbox确实很占 ...
- bzoj3436: 小K的农场(差分约束)
3436: 小K的农场 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 1575 Solved: 690[Submit][Status][Discus ...
- compare正序与逆序
//list:在数据查询出来的Record集合 //juli:是需要比较的字段 //实现一个Comparator接口 //后面减去前面是正序 前面减去后面是倒叙 //我这里做的一个距离排序 R ...
- 2015 多校赛 第四场 1009 (hdu 5335)
Problem Description In an n∗m maze, the right-bottom corner is the exit (position (n,m) is the exit) ...
- Windows phone开发 页面布局之屏幕方向
(博客部分内容参考Windows phone开发文档) Windows phone的屏幕方向是利用Windows phone设备的方向传感器提供的数据实现切换的. Windows Phone支持纵向和 ...