CSS样式表------第一章：样式表的基本概念
CSS（Cascading Style Sheets,层叠样式表），控制页面样式外观，作用是美化HTML网页。
一、 样式表的基本概念
1、样式表的分类
（1）内联样式表 -----放在元素的开始标记中，只对当前元素起作用，和html联合显示，控制精确，但是可重用性差，冗余多。
例：
<input name="txt" style="border:0px; border-bottom:1px solid black;" type="text" />
例：
显示结果：
（2）内嵌样式表 -----作为一个独立区域，内嵌在网页里，可以对整个页面起作用，必须写在<head></head>之间。
例：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
input
{
border:5px; <style之间的是内嵌样式表，在<head></head>之间-->
color:#3F6;
border-bottom:3px solid red;
}
</style>
</head>
<body>
<input type="text" name="a1" id="a1">
<input type="buttom" name="a2" id="a2" value="按钮">
<p>你好</p> <!--input之外的不变，没影响-->
</body>
显示结果：
（3）外部样式表 -----放在一个单独的.CSS样式表文件中，可以对整个网站起作用。
操作方式：新建一个.CSS文件，用来存放样式表——>在HTML中调用样式表，要在HTML中点右键——>CSS样式表——>附加样式表。样式表一般用link连接方式。
1、外部样式表的定义。
例：
@charset "utf-8";
/* CSS Document */
input
{
border:5px;
color:#3F6;
border-bottom:3px solid red;
}
2、外部样式表的调用。
例：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="file:///E|/网页/Untitled-2.css" rel="stylesheet" type="text/css" /> <!--link连接的外部样式表-->
</head>
<body>
<input type="text" name="a1" id="a1">
<input type="buttom" name="a2" id="a2" value="按钮">
<p>你好</p>
</body>
显示结果：
CSS样式表------第一章：样式表的基本概念的更多相关文章
- SQL Server(第一章) 创建表 删除表 创建主键约束、唯一约束、外键约束、CHECK约束、默认约束
1.Employees员工表 /** 创建Employees员工表 **/ USE TSQL2012 IF OBJECT_ID('dbo.Employees','U') IS NOT NULL DRO ...
- 关于CSS学习的第一章
1.CSS三种书写的方式:嵌入式.外链式.行内式 嵌入式就是将CSS写入在<style></style> 外链式将外面的CSS文件通过HTML中的标记链接过来:<link ...
- 第一章：Lambda表达式入门概念
要点:将行为像数据一样传递. 一.几种形式 1.没有参数,用()表示 () ->System.out.println("Hello World"); 2.有且仅有一个参数,省 ...
- CSS中的各个选择节点，都有样式最后一个无样式的快捷解决方法
2.1.3 多标签 多标签选择器一般和html上下文有关,它有以下集中分类 选择一个祖先的所有子孙节点,例如 div p{…} 选择一个父元素的所有直属节点,例如 div > p{…} 选择某一 ...
- from表单、css选择器、css组合器、字体样式、背景属性、边框设置、display设置
目录 一.form表单 1.form表单功能 2.表单使用原理 二.前端基础之css 1.关于css的介绍 2.css语法 3.三种编写CSS的方式 3.1.style内部直接编写css代码 3.2. ...
- CSS 小结笔记之三种样式表
CSS 引入共有三种方式:内部样式表,内联样式(行内样式)表,外部样式表,当然也可以使用多重样式 内联样式 <div style="color:red;font-size:20px&q ...
- CSS学习（3）样式表
如何插入样式表 插入样式表的方法有三种: 外部样式表(External style sheet) 内部样式表(Internal style sheet) 内联样式(Inline style) 外部样式 ...
- 【译】HTML表单高级样式
系列文章说明 原文 在本文中,我们将了解如何在HTML表单上使用CSS,为那些难于自定义的表单组件加以样式.如前文所述,文本框和按钮很适合使用CSS,而现在我们得来探索HTML表单样式的那些坑了. 在 ...
- BootStrap的table表格，栅格系统，form表单的样式
BootStrap BootStrap的简介 1. 什么是Bootstrap 由两个前端设计师开发的一个前端的框架(Html,css,js) 简化了程序员写css的代码 2. 为什么使用B ...
随机推荐
- 第四章:Schema与数据类型优化
1. 选择优化的数据类型 选择数据类型的原则 更小的通常更好:选择可以正确存储数据的最小数据类型 小的数据类型消耗更少的内存.CPU;占用更少的磁盘 选用简单的数据类型:简单的数据类型通常需要更少的C ...
- 最短路问题--Floyd 畅通工程续
畅通工程续 某省自从实行了很多年的畅通工程计划后,终于修建了很多路.不过路多了也不好,每次要从一个城镇到另一个城镇时,都有许多种道路方案可以选择,而某些方案要比另一些方案行走的距离要短很多.这让行人很 ...
- .equal()和==的区别
1.首先,equal和==最根本的区别在于equal是一个方法,而==是一个运算符. 2.一般来说,==运算符比较的是在内存中的物理地址,.equal()比较的是哈希算法值是否相等(即hashcode ...
- Python-查找并保存特定字符串后面的字符串
-- -- 本算法用于查找并存储“特定字符串”后面的字符串. -- 举例: strli = "kaka is li is da is wei !" #用于查找的字符串 sep_li ...
- Docker MongoDB 集群搭建
简单地在Docker环境上搭建一个无认证的MongoDB集群.1.本文使用的容器集群角色 ContainerName IP:portConfig Server cfg_1 10.1.1.2:27 ...
- Android 公告新闻消息资讯之垂直滚动效果
垂直滚动新闻栏的实现原理: 就是一个自定义的LinearLayout,并且textView能够循环垂直滚动,而且条目可以点击,显示区域最多显示2个条目,并且还有交替的属性垂直移动的动画效果,通过线程来 ...
- JAVA内存分配-通俗讲解
Java的内存分配上,主要分4个块: 一块是用来装代码的,就是编译的东西. 一块是用来装静态变量的,例如用static关键字的变量,例如字符串常量. 一块是stack,也就是栈,是用来装变量和引用类型 ...
- MyBatis学习——动态SQL
开发人员在使用JDBC框架或者其他类似的框架进行数据库开发时,通常都要根据需求去手动拼接SQL,这样非常麻烦,而myBatis提供了对SQL语句动态组装的功能,恰好解决了这一问题. 一,动态SQL中的 ...
- spring学习之依赖注入DI与控制反转IOC
一 Ioc基础 1.什么是Ioc? Ioc(Inversion of Control)既控制反转,Ioc不是一种技术,而是一种思想,在Java开发中意味着将设计好的对象交给容器来进行控制,并不是像传统 ...
- malloc 底层实现及原理
摘要:偶尔看到面试题会问到 malloc 的底层原理,今天就来记录一下,毕竟学习要“知其所以然”,这样才会胸有成竹. 注:下面分析均是基于 linux 环境下的 malloc 实现.步骤是:先总结结论 ...