Java 新手学习 CSS样式列表 排版 格式布局
1,样式表分为 内联样式表 内嵌样式表 外部样式表 三种。
内联样式表是直接写在标签里面的 比如 <p style=“”></p> <div style=""></div>
内嵌样式表是必须写在head 标签里面的 比如
<style>
p{样式}
</style> 只针对body 里的p 标签 改变样式
也可以是
<style>
div{样式(样式可以自己设定)比如 width:200px; height:50px; border:1px solid red; top:10px; left:20px; 那么div层标签的效果会是宽200高50 边框线为1像素 实线 红色实线的框, 当然也可以添加更多的样式效果在里面}
</style>只针对body里的div标签 改变样式
这是用标签名做的 选择器 比如p层标签、div层标签
还有一种class选择器 都是“."开头的 比如
<head><style>
.(点后面随便起名字方便记住就行 但是不能单独用数字命名 可以字母加数字 但数字不可以在开头 列如 a1 但不能是 1a)
{样式}</style></head>
这种选择器在head标签里写完了 要在body里的层标签 里引用 比如
<body>
<div class="上面点后边起好的名字”></div>这样div层标签就会执行class的样式指令了
<p class=“”></p>这个p标签也会执行class的指令
</body> class选择器可以重复使用 也就是说可以同时被多个标签引用
还有一种ID选择器 这个在head的标签里以#开头 比如
<head><style>
#(名字){样式}</style></head>
<body>
<div id="(名字)“></div>
</body> 这种选择器的应用方式跟class一样 但是class可以被重复使用 id不能重复使用 也就是说#ab 只能在body里出现一次 如果是不同名字的# 可以被多次使用
比如#aa 可以跟#bb 同时出现在body里面
选择器种类里还有三种符合选择器
1)用,逗号隔开 表示并列 比如
<head><style>
p,span,div{样式}
</style></head> 这样p标签span标签和div标签可以同时执行样式的指令
2)用空格隔开 表示后代 比如
<head><style>
div p{样式}
</style></head>只有div标签里的p标签执行此命令 比如
<body>
<div><p></p></div>
</body>这中情况下是执行 div p 样式指令的
3)(.)表示筛选 这种情况跟用空格功能基本一样
格式与布局
1)position:fixed 锁定位置是相对于浏览器的
2)position:absolute 是绝对位置 这个有两种情况
一种是外层没有position:absolute或者是relative的情况下,创建的div是相对于浏览器定位的
另一种是外层有position:absolute或者relative,那么div就会相对于外层的边框定位
3)position:relative 是相对于默认位置的定位 (绝对定位是在页面上面进行定位,相对定位是真实的在页面里面占有某一块区域,有上下左右值的时候只是进行
形状上的平移,真实占有的位置不变)
分层 z-index 在z轴方向分层,层数越高越不容易被盖住, z-index层数默认为1
float:left right
overflow:hidden; 为超出部分隐藏 overflow:visible;显示
超链接的样式
<style>
a:link 每点击是原来的样子
a:visited 访问过的链接样式
a:hover 鼠标指向是的样式 也就是把鼠标放在上面显示的样式
opacity 透明度



Java 新手学习 CSS样式列表 排版 格式布局的更多相关文章
- CSS样式表与格式布局
样式表 CSS(Cascading Style Sheets 层叠样式表),作用是美化HTML网页. 内联样式表: 例:<p style="font-size:10px;" ...
- Java新手学习路线
转自网络 分享个JAVA学习路线[新手可以参考看下]觉得不好的,大家可以提出来我补充. 第一阶段 技术名称 技术内容 J2SE(java基础部分) java开发前奏 计算机基本原理,Jav ...
- java基础57 css样式、选择器和css定位(网页知识)
本文知识点(目录): 1.CSS样式 2.选择器 3.CSS定位 1.CSS样式 1.html 在一个网页中负责的是一个页面的结构 2.css(层叠样式表)在一个页面中负责了一个页面 ...
- 引用css样式的书写格式
css的书写格式一共有三种 行内样式:意思是在行内中写样式 例如说<p style="color:red">用行内样式编写我的颜色</p> 只适用于< ...
- 学习 CSS 样式
1.CSS浮动 : http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论: ...
- css的基本操作学习--css样式,选择器,hover,文字属性,文本属性,背景
什么是css? 通配符选择器 <head> /* *通配符选择器 匹配任何元素 */ *{ margin: 0; padding: 0; } </head> css样式有三种 ...
- 前端学习笔记--CSS样式--列表和表格
1.列表 2.表格 odd:奇数 even:偶数
- bootstrap的学习-基础样式和排版一
一.列表去除样式和横排排列 classs="list-unstyled","list-inline" 二.[表格].table 类指定基本样式,.table-s ...
- Bootstrap全局CSS样式之排版
Bootstrap能全然友好的支持html5的文本元素,这里不再赘述,详细可參考我还有一篇文章<html的文本元素总结>,这里主要针对Bootstrap封装好的CSS文本样式做一下汇总. ...
随机推荐
- unity3d插件Daikon Forge GUI 中文教程1-Daikon Forge介绍
DF-GUI特点: · 深编辑器集成:DF-GUI提供广泛的整合与Unity3D编辑环境,包括自定义检查人员对每个组件向导来简化复杂的多步任务,提高生产力的上下文菜单,编辑控件在一个所见 ...
- HTML静态网页 css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...
- 关于在VS 上发布网站
在vs 上建立的网站只能用 localhost 进行访问,想要自己本机上的网站发布到IIS上面,这样就可以直接用 IP 地址来访问了,那么照如下的方式做: 1. 首先需要使用vs 发布自己的网站 1. ...
- 一篇很全面的freemarker教程
以下内容全部是网上收集: FreeMarker的模板文件并不比HTML页面复杂多少,FreeMarker模板文件主要由如下4个部分组成:1,文本:直接输出的部分2,注释:<#-- ... --& ...
- service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误
service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误的方法如下: [root@ctohome.com ~]# service ...
- C#构造Http 破解学校教务系统学生账号密码
背景介绍 我们学校的教务系统的是以学生学号作为登陆账号,初始密码是自己的生日. 一点点想法 每次期末查成绩的时候,我都会有一个想法,要是我能跑到系统后台,把自己的成绩修改一下,那该时间多么舒坦的事情啊 ...
- GROUP BY 與 Null 值
若群組資料行包含了 Null 值,該資料列將變成結果中的一個群組.若群組資料行內包含了多個 Null 值,Null 值將放入單一群組內.此行為定義於 SQL-2003 標準之中. Product 資料 ...
- Linux搭建QT环境笔记
*** [../../../../lib/libQtWebKit.so.4.7.4] Error 1make[1]: Leaving directory `/home/cloverbox/qt-eve ...
- ArcGIS Server 增加缓存路径
Server缓存服务,由于缓存文件经常比较大,默认放在C盘下容易导致磁盘空间不够,因此Server提供了增加缓存路径的方法来解决该问题. 增加的路径有两种,一种是Server所在服务器增加一个和原缓存 ...
- 在 Amazon AWS 搭建及部署网站:(一)申请、设置 AWS 服务
亚马逊 AWS 介绍 简单来说,AWS (Amazon Web Service) 提供了一整套基础设施和服务,使"建站"这件事变得轻松愉快. 你可以利用AWS构建博客主机,云存储( ...