CSS样式补充第二天
#p1{
/* border-width: 1px;*/
/*边框实线*/
/*border-style: solid;*/
/*边框虚线*/
/*border-style: dashed;*/
/*边框点线*/
/*border-style:dotted;*/
/*边框双线*/
/*border-style:double;*/
/*边框颜色*/
/*border-color: red;*/
/*简单写法*/
/* border: 1px dotted orange;*/
border-bottom: 1px dotted #A2A0A0;
border-left: 2px double red;
/*背景颜色*/
/* background-color: blue;*/
background-image: url(img/a.jpg);
/*背景图位置 */
background-position: -30px -500px;
}
元素标签引用案例
li{
border-bottom: 1px dotted yellow;
}
body{
background-image: url(img/2.png);
background-repeat: repeat-y;
background-attachment: fixed;
}
<ul type="dis">
<li>选项一</li>
<li>选项二</li>
</ul>
CSS图片位置的调整 案例
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#in1{
background-image:url(img/bg.png);
background-position: -247px -90px;
text-indent: 25px;
}
</style>
</head> <body>
<input type="text" id="in1">
</body>
</html>
给文字添加触碰效果,点击后效果,移动到效果
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>伪类</title>
<style>
/*未访问的样式*/
#a1:link{
text-decoration: none;
color: red;
}
/*访问后的样式*/
#a1:visited{
color: yellow;
}
/*鼠标悬浮时的样式*/
#a1:hover{
color:#666666;
}
/*点击时的样式*/
#a1:active{
color:blue;
}
/*hover可以用在任意标签*/
#p1:hover{
color: pink;
}
</style>
</head> <body>
<a href="#" id="a1">百度</a>
<p id="p1">这是p标签</p>
<a href="#" style="text-decoration: none;">去下划线超链接样式</a>
</body>
</html>
有序列表无需列表用CSS样式快速编辑
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
ul li{
/*list-style-type: circle;*/
list-style-image: url(img/sp.png);
}
ol li{
list-style-type: lower-alpha;
}
</style>
</head> <body>
<!--无序列表-->
<ul>
<li>语文</li>
<li>数学</li>
<li>英语</li>
</ul>
<!--有序列表-->
<ol>
<li>美术</li>
<li>体育</li>
<li>艺术</li>
</ol>
</body>
</html>
CSS样式补充第二天的更多相关文章
- CSS样式补充代码
CSS符号属性: list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roma ...
- CSS样式表-------第二章:选择器
二 .选择器 内嵌.外部样式表的一般语法: 选择器 { 样式=值: 样式=值: 样式=值: ...... } 以下面html为例,了解区分一下各种样式的选择器 <head> <met ...
- html学习第二天—— 第七章——CSS样式基本知识
外部式css样式,写在单独的一个文件中外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<s ...
- HTML第二部分 CSS样式表
CSS(cascading style sheets,层叠样式表),作用是美化HTML网页. /*注释*/ 注释语法 2.1 样式表的基本概念 2.1.1样式表的分类 1.内联样式表 和HTML联 ...
- 11-19网页基础--第二部分CSS样式表基本概念
CSS,全称(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. 一.基本概念:是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 你可能对C ...
- 网站开发综合技术 第二部分 CSS样式表
第2部分 CSS样式表 CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. /*注释*/ 注释语法 2.1.样式表的基本概念 2.1.1.样式表分类 1 ...
- CSS样式----图文详解:css样式表和选择器
主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...
- css样式兼容不同浏览器问题解决办法
在网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网,就应该更注意IE6 IE7 FF对CSS样式的兼容,不然,你的网乱可能出去不想出现的效果! 所 有浏览器 ...
- CSS样式----CSS的继承性和层叠性(图文详解)
CSS的继承性 我们来看下面这样的代码,来引入继承性: 上方代码中,我们给div标签增加红色属性,却发现,div里的每一个子标签<p>也增加了红色属性.于是我们得到这样的结论: 有一些属性 ...
随机推荐
- FASM学习中的一些表格
Size operator Registers Data directives Conditions(jmp助记符)
- P4312 [COCI 2009] OTOCI / 极地旅行社
思路 LCT维护和的板子 注意findroot的时候要先access一下,修改点权之前要先splay到根 代码 #include <cstdio> #include <algorit ...
- Windows 启用/禁用内置管理员 Administrator
关于启用 Windows 系统内置的管理员 Administrator 的方法还是许多的,其中普遍的一种应该就是进入(我的电脑/计算机右键管理/Windows + R输入 compmgmt.msc)计 ...
- Java 中断
https://zhuanlan.zhihu.com/p/45667127 看的似懂非懂
- vue 2.0 使用replace时要点击路由多次才能返回
项目中有一个选择机场的需求,从表单页面--->机场页面(选择出发机场)-->表单页面-->机场页面(选择到达机场); 如果只用push跳转的话,页面返回必然会返回机场选择页面. 所以 ...
- [flask]gunicorn配置文件
配置文件 #!/home/xx/.virtualenvs/xx/bin/python # encoding: utf-8 import multiprocessing # 监听端口 bind = '0 ...
- three.js 第二篇:场景 相机 渲染器 物体之间的关系
w我用画画来形容他们之间的关系 场景就是纸张 相机就是我们的眼睛 物体就是在我们脑海中构思的那个画面 渲染器就是绘画这个动作 场景(Scene): 初始化:var scene = new THREE. ...
- python入门-基础语法
一.变量 定义字符串要加单引号‘’ 变量命名规范: 变量名只能是字母.数字或下划线的任意组合 变量名的第一个字符不能是数字 变量名不能用关键字 变量名不要用中文 变量名不要太长,区分大小写 面就用单引 ...
- promise学习总结
什么是Promise Promise是异步编程的一种解决方案,它有三种状态,分别是pending-进行中.resolved-已完成.rejected-已失败 当Promise的状态又pending转变 ...
- PI上导入RFC
ERP中创建函数:ZERP_GETSPAREPART 传入参数:SOLD_TO_ID SHIP_TO_ID 表:INTABLE OUTABLE 登陆PI, 后面正常做data type DT_PART ...