CSS结构的基础认知

css的属性值与html的属性值用法不相上下,但是css主要分为内联样式表和外联样式表。

内联样式表用法:在html文件中的《head》头文件中添加<style></style>标签,在标签内添加所需的属性值,例如:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
</style>
</head>

外联样式表用法:在同一项目的目录下创建css为拓展名的文件,在文件编写所需属性和个人style,在HTML内编写代码:<link rel="stylesheet" href="文件名" />进行调用。

CSS样式表规则中class标记和超链接的用法:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
p.first{text-indent: 0.5in;}
p.second{text-indent: 1.0in;}
.main01{font-size: 10pt;color: red;}
#01{font-size: 10pt;color: yellow;}
#02{font-size: 12pt;color: blue;}

        //属性:link链接本身;visited被访问过时;hover指向时;a:link{font-size: 10pt;color: blue;text-decoration: none;}a:visited{font-size: 13pt;color: gray;text-decoration: underline;}a:hover{font-size: 16pt;color: red;text-decoration: overline;}</style>
</head>
<body><!--创建class-->//<标记 class="类名"></标记>//直接用class定义段落的缩进大小<p class="first">这个段落缩进0.5in</p><p class="second">这个段落缩进1.0in</p>//<标记 class="类名"></标记>//调用.main01定义段落和单元格的属性<p calss=".main01"></p><td calss="main01"></td>//<标记 id="id名"><font id="01">php是世界上最好的语言</font><font id="02">php是世界上最好的语言</font><!--超链接--><a href="http://www.baidu.com">first</a>《style中的属性一一对应body中class和超链接的用法》

这是一些关于css的属性注释:
/文本对齐/
h1{text-align:center}
/文本缩进/
h1{text-indent: 50px;}
/行高/
body{line-height: 120%;}
/字间距/
body{letter-spacing: 0.1cm;}
/文本装饰/
h3{text-decoration: underline;}
/垂直对齐/
<p>平方值:3<font style="vertical-align:super">2</font></p>
/文本变换/
p{txet-transform:capitalize}

转载于:https://blog.51cto.com/13881481/2151580

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/390039.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

BZOJ1453: [Wc]Dface双面棋盘

Time Limit: 10 Sec Memory Limit: 64 MB Submit: 784 Solved: 422 [Submit][Status][Discuss] Description 佳佳有一个 nnn 行 nnn 列的黑白棋盘&#xff0c;每个格子都有两面&#xff0c;一面白色&#xff0c;一面黑色。佳佳把棋盘平放在桌子上&#xff0c;因此每个格子恰好一…

用户体验数据分析 书单_如何使用数据改善用户体验设计

用户体验数据分析 书单In the current age of technology, if an entrepreneur comes up with a grand idea, chances are they’ll need a pretty sweet website to go along with it. And if they want their idea to really sell, they will also need a website that reall…

推荐11个实用的JavaScript库

2019独角兽企业重金招聘Python工程师标准>>> JavaScript 仍然是 2018 年最受欢迎和使用最为广泛的编程语言&#xff0c;因此 JavaScript 生态系统也会继续发展壮大。 然而&#xff0c;JavaScript 的标准库仍然继续保持“短小精悍”的身材。为了填补标准库功能方面的…

371. 两整数之和

371. 两整数之和 给你两个整数 a 和 b &#xff0c;不使用 运算符 和 - ​​​​​​​&#xff0c;计算并返回两整数之和。 示例 1&#xff1a; 输入&#xff1a;a 1, b 2 输出&#xff1a;3 示例 2&#xff1a; 输入&#xff1a;a 2, b 3 输出&#xff1a;5 提示&a…

【福利】微信小程序精选Demo合集

小编最近在开发小程序&#xff0c;也读到了不少优秀的小程序源码&#xff0c;项目中有些需求可以直接从源码里粘贴复制过来&#xff0c;虽然这样做不利于自己独立编写代码&#xff0c;但比较是给公司做项目啊&#xff0c;秉着效率第一的原则&#xff0c;简直没有什么比ctrlc,ct…

639. 解码方法 II

639. 解码方法 II 一条包含字母 A-Z 的消息通过以下的方式进行了编码&#xff1a; A -> 1 B -> 2 ... Z -> 26要 解码 一条已编码的消息&#xff0c;所有的数字都必须分组&#xff0c;然后按原来的编码方案反向映射回字母&#xff08;可能存在多种方式&#xff09;。…

[cpyhon源代码]dict对象原理学习

Cpython 2.7 分支中&#xff0c;dict 对象的源代码 lookdict 搜索算法 1 static PyDictEntry *2 lookdict(PyDictObject *mp, PyObject *key, register long hash)3 {4 register size_t i;5 register size_t perturb;6 register PyDictEntry *freeslot;7 regis…

熊猫数据集_熊猫迈向数据科学的第一步

熊猫数据集I started learning Data Science like everyone else by creating my first model using some machine learning technique. My first line of code was :通过使用某种机器学习技术创建我的第一个模型&#xff0c;我开始像其他所有人一样学习数据科学。 我的第一行代…

SQLServer锁的机制

SQLServer锁的机制&#xff1a;共享锁(S)排它锁(X)更新锁(U)意向共享 (IS)意向排它 (IX) 意向排它共享 (SIX)架构修改(Sch-M) 架构稳定性(Sch-S)大容量更新&#xff08;BU&#xff09;转载于:https://www.cnblogs.com/yldIndex/p/8603902.html

你是否具有价值

一个有价值的人往往受欢迎的程度才会高。白天上午花了两个多小时的时间帮前同事远程解决了服务器部署时由于防火墙机制问题引起的系统功能失败的问题。解决完这个问题之后&#xff0c;同事的心情很愉悦&#xff0c;其实我自己的心情也很愉悦&#xff0c;看来人都有帮助别人和被…

为什么选择做班级管理系统_为什么即使在平衡的班级下准确性也很麻烦

为什么选择做班级管理系统Accuracy is a go-to metric because it’s highly interpretable and low-cost to evaluate. For this reason, accuracy — perhaps the most simple of machine learning metrics — is (rightfully) commonplace. However, it’s also true that m…

使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等)

使用Chrome开发者工具调试Android端内网页(微信&#xff0c;QQ&#xff0c;UC&#xff0c;App内嵌页等) 传送门转载于:https://www.cnblogs.com/momozjm/p/9389912.html

517. 超级洗衣机

517. 超级洗衣机 假设有 n 台超级洗衣机放在同一排上。开始的时候&#xff0c;每台洗衣机内可能有一定量的衣服&#xff0c;也可能是空的。 在每一步操作中&#xff0c;你可以选择任意 m (1 < m < n) 台洗衣机&#xff0c;与此同时将每台洗衣机的一件衣服送到相邻的一台…

netflix的准实验面临的主要挑战

重点 (Top highlight)Kamer Toker-Yildiz, Colin McFarland, Julia GlickKAMER Toker-耶尔德兹 &#xff0c; 科林麦克法兰 &#xff0c; Julia格里克 At Netflix, when we can’t run A/B experiments we run quasi experiments! We run quasi experiments with various obje…

网站漏洞检测针对区块链网站安全分析

2019独角兽企业重金招聘Python工程师标准>>> 目前移动互联网中&#xff0c;区块链的网站越来越多&#xff0c;在区块链安全上&#xff0c;很多都存在着网站漏洞&#xff0c;区块链的充值&#xff0c;会员账号的存储性XSS窃取漏洞&#xff0c;账号安全&#xff0c;等…

223. 矩形面积

223. 矩形面积 给你 二维 平面上两个 由直线构成的 矩形&#xff0c;请你计算并返回两个矩形覆盖的总面积。 每个矩形由其 左下 顶点和 右上 顶点坐标表示&#xff1a; 第一个矩形由其左下顶点 (ax1, ay1) 和右上顶点 (ax2, ay2) 定义。 第二个矩形由其左下顶点 (bx1, by1) …

微观计量经济学_微观经济学与数据科学

微观计量经济学什么是经济学和微观经济学&#xff1f; (What are Economics and Microeconomics?) Economics is a social science concerned with the production, distribution, and consumption of goods and services. It studies how individuals, businesses, governmen…

NPM 重新回炉

官方教程传送门( 英文 ) 本文主要是官方文章的精炼,适合想了解一些常用操作的同学们 NPM 是 基于node的一个包管理工具 , 安装node环境时会自带安装NPM. NPM版本管理 查看现有版本 npm -v 安装最新的稳定版本 npm install npmlatest -g 安装最新的测试版本 npm install npmn…

1436. 旅行终点站

1436. 旅行终点站 给你一份旅游线路图&#xff0c;该线路图中的旅行线路用数组 paths 表示&#xff0c;其中 paths[i] [cityAi, cityBi] 表示该线路将会从 cityAi 直接前往 cityBi 。请你找出这次旅行的终点站&#xff0c;即没有任何可以通往其他城市的线路的城市。 题目数据…

如何使用fio模拟线上环境

线上表现 这里我想通过fio来模拟线上的IO场景&#xff0c;那么如何模拟呢&#xff1f; 首先使用iostat看线上某个盘的 使用情况&#xff0c;这里我们需要关注的是 avgrq-sz, avgrq-qz. #iostat -dx 1 1000 /dev/sdk Device: rrqm/s wrqm/s r/s w/s rkB/s …