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& ...
随机推荐
- Git 将本地代码推到 Coding 远程仓库
1 首先创建文件夹,将要推的项目文件夹拷贝过来,进入文件夹 右键 Git Bash Here 输入以下代码 把这个目录变成git管理的仓库 git init 2 把文件添加到版本库中,使用命令 git ...
- Openssl gendsa命令
一.简介 gendsa命令能够根据DSA密钥参数生成DSA密钥 二.语法 openssl gendsa [-out filename] [-passout out] [-rand file(s)] [ ...
- loadrunner录制时web时,ie报安全证书问题
解决方法:在Recording_Options下Port Mapping>Capture level设置为 WinNet level data Capture Level的设置说明:1.Sock ...
- [Training Video - 4] [Groovy] Optional parameter in groovy
Employee.log=log Employee e1 = new Employee() log.info e1.add(1,2,3,4) // optional parameters in gro ...
- EF配置文件初始化数据库 codefirst
. using ConsoleApplication42; using System.Data.Entity; using System.Data.Entity.ModelConfiguration. ...
- Debian/Linux系统安全配置教程
禁止root SSH登陆 配置SSH Key 配置iptables 当我们安装完Linux系统作为服务器后,总有一系列的安全配置需要进行.特别是当你的服务器Ip是对外网开放的话.全世界有很多不怀好意的 ...
- Redis初学笔记
1.官网概述 Redis is an open source (BSD licensed), in-memory data structure store, used as database, cac ...
- response乱码和request乱码
response乱码 一.浏览器乱码 原因是:浏览器显示编码和文件的数据编码不一致 浏览器显示编码 response.setCharacterEncoding("utf-8"); ...
- Yii2 修改 breadcrumb 首页图标
<?=Breadcrumbs::widget([ 'homeLink' => [ 'label' => '<i class="fa fa-home"> ...
- 如何快速增加pdf书签,解除pdf限制
一.需要的工具 福昕PDF阅读器 Foxit PDF Editor 2.2.1 build 1119 汉化版 下载地址:http://www.onlinedown.net/soft/51002.htm ...