css样式引入方式，及常用设置标签样式
一. 三种样式引入方式
<div style="color:red;font-size:20px;font-family:'Microsoft Yahei';line-height:30;">
你好，我叫韩妹妹<br\>
你叫什么名字
</div>
<head>
<style type="text/css">
div{
color:red;
font-size:20px;
font-family:'Microsoft Yahei';
line-height:30;
}
</style>
</head>
<body>
<div>
你好，我叫韩妹妹
</div>
</body>
新建一个样式文件夹css，并在其中新建一个css文件，比如main.css，在其中写入
div{
color:red;
font-size:20px;
font-family:'Microsoft Yahei';
line-height:30;
} 然后在原先网页上头部写入如下, 同样会把所有body中<div>标签中的内容应用指定样式
<head>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
二. 设置标签样式，基本示例
1. 如果文本中有某个词汇使用了<em>标签，要想使<em>标签中的文本不倾斜，可以在main.css中定义标签选择器<em>,如下，那么文本中所有的<em>标签都不会倾斜了
em{
font-style:normal;
} 2. 使用span标签使某个字段加粗，同样在main.css中写入
span{
font-weight:bold;
} 3. 不想让<h2>样式加粗，并且用微软雅黑字体，在main.css中写入
h2{
font-family:'Microsoft Yahei';
font-weight:normal;
} 4. 使用font，用一句来设置是否加粗，字体大小，行高，字体类型，需要按顺序写
div{
font:normal 30px/40px 'Microsoft Yahei'; #normal不写的话，默认是normal，对于<h1>也适用
} 5. 去掉<a>标签中的下划线
a{
text-decoration:none;
} 6. 设置<div>标签中的文字首行缩进2个字
div{
color:red;
font-size:20px;
text-indent:40px; #想缩进几个，就是几倍的font-size值
font-family:'Microsoft Yahei';
line-height:30;
} 7. 设置文本居中，也就是设置文字水平对齐方式
h2{
font:normal 30px/40px 'Microsoft Yahei';
text-align:center #默认值是left, 也可以写成right，右对齐
}
css样式引入方式，及常用设置标签样式的更多相关文章
- 前端（二）—— CSS的引入方式、长度与颜色单位、常用样式、选择器
CSS的引入方式.长度与颜色单位.常用样式.选择器 一.CSS的三种引入方式 1.行间式 <!doctype html> <html> <head> <met ...
- CSS的引入方式和样式
CSS的引入方式和样式 一.样式 行内样式 内接样式 外接样式(1.链接式 2.导入式) <!--行内样式--> <div> <p style="color: ...
- python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)
一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...
- Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）
一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...
- CSS的引入方式
再用HTML编写的文本中,有是没能达到我们想要的效果,此时此刻我们可以用过引用CSS来控制!这不仅使得效果好而且代码层次清晰.CSS的引入方式可以分为四类: 1.链入外部样式表,就是把样式表保存为一个 ...
- 前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器
前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器 一丶CSS简介 叠样式表(英文全称:Cascading Style Sheets)是一种用来表现 ...
- HTML三种样式引入方式
HTML三种样式引入方式 HTML有三种样式引入方式:行内样式(inline Styles).嵌入式样式表(Embedded Style Sheets).外部样式表(External Style ...
- CSS的引入方式和复合选择器
CSS的引入方式 样式表 优点 缺点 范围 行内样式表 书写方便 结构样式混写 控制一个标签 内部样式表 部分结构和样式相分离 没有彻底 控制一个页面 外部样式表 完全实现结构和样式分离 需要引入 控 ...
- css样式清零及常用类
css样式清零及常用类 @charset "utf-8"; /*CSS Reset*/ /*"微软雅黑","\5FAE\8F6F\96C5\9ED1& ...
随机推荐
- 【BZOJ3998】弦论 【后缀自动机】
题意 给定一个长度为n的字符串,求他的第k小子串是什么. 分析 T=0的时候,这个题跟SPOJ-SUBLEX的做法一样,当T=1的时候,不同位置的子串算多个,那么初始化的时候d[u]=cnt[u],没 ...
- 快速求出n!的质因数的个数
一般做组合数的题目都要进行质因数的分解,我们一般是for循环对每个数进行质因数分解,大多数情况都不会超时,但极少数的情况下,题目会不允许这样的做法,所以我们需要学会一种更快的方法来求质因数. 我们一般 ...
- [SoapUI] 通过Groovy获取SoapUI当前Project所在的目录
import com.eviware.soapui.support.GroovyUtils def groovyUtils = new GroovyUtils( context ) def proje ...
- zigbee广播通信原理
广播:可以理解成,发送模块发出数据,这个网络里的所有节点模块都可以拿到这个数据. 实验:终端模块以广播的形式发送出去,让协调器和路由器模块作为接收器收到数据并显示出来! 协调器模块作为接收模块: 和单 ...
- axure & Markman学习总结
最近学了几款有意思的软件,一款是axure,另一款是Markman.接下来聊聊自己的学习心得吧. 关于axure,百度上的解释是:是一个专业的快速原型设计工具.在我看来,它就是能快速把效果网页做给客户 ...
- 用nodejs搭建最简单、轻量化的http server(转)
出处:http://www.cnblogs.com/wangfupeng1988/p/4143996.html 1. 引言 前端程序猿主要关注的是页面,你可能根本就用不到.net,java,php等后 ...
- k8s启动Pod遇到CrashLoopBackOff的解决方法
1.用kubectl get pod 当看到上面的状态后执行第2步 2.查看pod详情 [root@cc hzb]# kubectl describe pod ceph-mysql-hzb-pod 找 ...
- Joomla3x-CKEditor4x-WordPaster整合示例
1.1. 集成到Joomla_3.4.7-ckeditor4x 资源下载:Joomla 3x, 1.1.1. 添加wordpaster文件夹 路径:/media/wordpaster/ 1.1 ...
- 编写高质量代码改善C#程序的157个建议——建议81：使用Parallel简化同步状态下Task的使用
建议81:使用Parallel简化同步状态下Task的使用 在命名空间System.Threading.Tasks中,有一个静态类Parallel简化了在同步状态下的Task的操作.Parallel主 ...
- C#函数式程序设计之泛型（上）
在面向对象语言中,我们可以编写一个元素为某个专用类型(可能需要为此创建一个ListElement)的List类,或者使用一个非常通用.允许添加任何类型元素的基类(在.NET中,首先想到的是System ...