【css第二天】的更多相关文章

CSS第二天总结 更多的选择符

CSS的选择符非常多,今天继续总结后面的选择符 1.id和class选择符某些情况下我们用关系选择符或者伪类选择符无法选中一些元素时,我们可以给这些元素起 个名字或者分类,这就是id和class属性.下面给出一个id为xxx,class为yyy的a链接: <a href="" id="xxx" class="yyy">链接</a> CSS代码: #xxx{color: red} /*用#选择id(井号)*/ .yyy{te…

CSS第二篇

给导航设置圆角的代码: c3 里面的属性:border-radius:7px: 1补充盒子问题 (盒子边框紧邻变粗问题)将两个盒子边框重叠并且设置定位提高层级避免盒子重叠,鼠标放上去只显示一个盒子的边框. <style type="text/css"> div{ width:200px; heigh:200px: border:1px solid red; margin-left=-1px; } div:hover{ border-color:blue; position:…

潭州课堂25班：Ph201805201 WEB 之 CSS 第二课 (课堂笔记)

CSS 的引入方法: 第一种 : <!--直接在标签仙设置--><p style="color: yellow">CSS的第一种引入方法</p> 第二种方法,在 head 标签中设置 <style> div{ font-size: 18px; }</style> 第三种方法: 建一 CSS 文件,将设置写入该文件中, a{ text-decoration: none; /*去除下划线*/} 在 head 标签中用 link 标…

CSS第二节

div做页面布局的建议 把整个网页从上到下分成若干块(一般分三块:头,中间,尾部),每一块都按下面的思路 先写第一层,可以设置背景色,或者高度和垂直居中(line-height保证内容不超出高度),不设高度,这个div的高度由内容撑起来 再写第二层,这个可以设置一个宽度=像素的值,这样整个内容就在这个区域内,如果页面宽度太小,页面下方会出现滚动条,不会造成内容混乱 第三次可以开始写你的内容,可以继续用div或者别的标签,宽度可以用百分比,也可以用像素,如果用了float,要使用clear <bo…

Head Html Css 第二版笔记

一. 引用 <blockquote>ago aog aogag </blockquote> 则是引用一大段文字并独立显示 二. <a> 创建目的地 <h2><a id="chai">Chai Tea</a></h2>//创建了一个目标锚 <a href="index.html#chai">See Chai Tea</a>//链接到的位置 使用id属性在页面中创…

CSS第二章

1. 文本与字体属性: text-decoration:文本修饰线  none(去除修饰线).underline(下划线).overline(上划线).line-through(删除线) color:设置文本的颜色 font-size:设置字体大小   值要在单位  px font-style:设置文字的样式   取值:italic(斜体) font-weight:设置文本的加粗效果   取值:normal(正常)  .bold(加粗) font-family:给文本设置字体   可以一次写多个…

妙味课堂——HTML+CSS(第二课)

常见标签——img标签 <img src="图片地址" alt="图片名"/> alt属性是图片名字,是给百度搜索引擎抓取使用的.也有当图片地址不正确时,显示图片名. 常见标签——a标签 1.a标签(链接) target链接打开方式(常用): _blank:新窗口 _self:当前窗口 <base target="_blank"/> 定义页面链接默认打开方式 例, <!DOCTYPE html> <htm…

css第二天

二丶 1.字体属性font: 字体名称(font-family)字体大小(font-size):pc中通常,字体大小表示为12px,14px.移动设备中通常表示为0.57rem.字体粗细(font-weight):设置或检索文本字体的粗细字体样式(font-style)行高(line-height)字体颜色(color)英文大小写(text-transform)文本修饰线(text-decoration):none无修饰.underline下划线.overline上划线.line-through…

css第二篇：样式的特殊性、重要性、继承和层叠

特殊性:   假设有几个不同的规则改变的都是同一个元素的值,那么哪一个规则将会胜出呢?这就得靠特殊值啦,什么是特殊值呢?特殊值的大小呢?如下图: 值越大代表越牛,如1,0,0,0永远大于0,X,X,X.这边再举几个特殊例子: html > body table tr[id="ddd"] > li {color:green} /* specificity = 0,0,1,5  [id="ddd"]的值为0,0,1,0*/ h1 + p { color:gr…

零基础学css第二天

内边距与外边距: <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> div{ height: 100px;/*高度*/ width: 100px;/*宽度*/ border: 1px solid;/*边框及边框线像素*/ margin-top: 100px;/*距离顶部*/ margin-left: 200px;/*距离左边*…

2014年辛星解读css第二节

第一节我们简单介绍了一下CSS的工作流程,我相信读者会有一个大体的认识,那么接下来我们将会深入的研究一下CSS的细节问题,这些问题的涉及将会使我们的工作更加完好. *************凝视************ 1.CSS也是须要凝视的.凝视中的内容不会被解释运行,它也和C语言一样.用/*开头,用*/结尾.当中的内容会被当做凝视.我们想怎么写就怎么写. 2.以下给个样例: p{ color: green; /* 我们在这里书写凝视 * 辛星CSS,与博客园共同成长 */ font-siz…

html+css第二篇

<img src="图片地址" alt="图片名"/> 图片(单标签)alt属性 是图片名字,是给百度搜索引擎抓取使用: a标签: 链接/下载/锚点 target 链接打开方式 blank 新窗口 self 当前窗口 <base target="_blank"/> 定义页面链接默认打开方式 常见标签 div 块 img 图片(单标签) a 链接.下载.锚点 h1-h6 标题 p 段落 strong 强调(粗体) em 强调…

css 第二排文字居中

text-align: center; 超过长度 自动换行居中…

前端知识杂烩（HTML[5]?+CSS篇）

1. CSS 优先级算法如何计算?2.如何居中div?如何居中一个浮动元素?如何让绝对定位的div居中?3.用纯CSS创建一个三角形的原理是什么?4. 如何解决inline-block元素的空白间距(i与li之间有看不见的空白间隔是什么原因引起的?有什么解决办法?5.CSS强制文本在一行内显示若有多余字符则使用省略号表示6.css中伪类属性修改a标签的样式:7. HTML dl 标签8. 置换元素与不可置换元素9.HTML的Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?10.…

[django]Django的css、image和js静态文件生产环境配置

前言:在Django中HTML文件如果采用外联的方式引入css,js文件或者image图片,一般采用<link rel="stylesheet" href="../css/lstyle.css">这个格式,但是django中需要配置一下,才能如此使用. 关键词:django静态文件 django生产环境 django1.8 正文: 第一步,在django工程目录下建立static文件夹,同时在static文件夹下建立css img js三个不同名称的文件…

HTML和xhtml，CSS

索引: 初学者入门书籍 高级进阶书籍 W3C官方手册 网站架构 移动平台网站开发 视频资源 开发工具 初学者入门书籍: 中文电子书    深入浅出html pdf中文版 魅丽的网页设计 JAVA WEB程序设计 Web程序设计(第5版)完整版 HTML & XHTML 权威指南(英文+中文版) Web编程入门经典:HTML.XHTML和CSS (第2版) HTML5与CSS3权威指南第1章~第3章 CSS商业网站布局之道(朱印宏著)pdf HTML与CSS入门经典(第7版) Eric Meyer…

CSS的4种引入方式及优先级

第一:css的四种引入方式 1.行内样式 最直接最简单的一种,直接对HTML标签使用style="",例如: <p style="color:#F00; "></p> 缺点:HTML页面不纯净,文件体积大,不利于蜘蛛爬行,后期维护不方便. 2.内嵌样式 内嵌样式就是将CSS代码写在<head></head>之间,并且用<style></style>进行声明,例如: <style type=…

Htmlt_Div+Css简介

DIV+CSS是网站标准(或称“WEB标准”)中常用术语之一,通常为了说明与HTML网页设计语言中的表格(table)定位方式的区别,因为XHTML网站设计标准中,不再使用表格定位技术,而是采用DIV+CSS的方式实现各种定位. CSS是英语Cascading Style Sheets(层叠样式表单)的缩写,它是一种用来表现 HTML 或 XML等文件式样的计算机语言. DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素.DIV的起始标签和结束标签之间的所有…

Learn CSS

韩顺平老师的CSS讲的还是很简单的,仅作入门. div+css的介绍    div+css是什么. div元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素. css是英语Cascading Style Sheets(层叠样式(大小/颜色/背景/位置)表单)的缩写,它是一种用来表现HTML或XML等文件样式的计算机语言. div+css是网站标准(或称“WEB标准”)中常用术语之一,通常为了说明与HTML网页设计语言中的表格(table)定位方式的区别,因为XHT…

#WEB安全基础 : HTML/CSS | 文章索引

本系列讲解WEB安全所需要的HTML和CSS #WEB安全基础 : HTML/CSS | 0x0 我的第一个网页 #WEB安全基础 : HTML/CSS | 0x1初识CSS #WEB安全基础 : HTML/CSS | 0x2初识a标签 #WEB安全基础 : HTML/CSS | 0x3文件夹管理网站 #WEB安全基础 : HTML/CSS | 0x4HTML模块化 #WEB安全基础 : HTML/CSS | 0x4.1嵌套列表 #WEB安全基础 : HTML/CSS | 0x5a标签拓展和cl…

#WEB安全基础 : HTML/CSS | 0x11 浅谈GET和POST

HTTP中的GET和POST请求方法 我上次提到了GET和POST,现在就让你来认识一下这些新朋友 请看图 POST和GET都是将用户输入到浏览器的数据发送给服务器,不过采用了两种不同的方式,POST会打包表单变量,在后台把它们发送到服务器,GET也会打包表单变量,但会把这些数据追加到URL上,然后向服务器发送一个请求 要了解GET请求就要使用它 试着把上次课的代码中的表单请求方法改成GET 这里我举一个例子 以下是代码 <!DOCTYPE html> <html> <hea…

#WEB安全基础 : HTML/CSS | 0x10.1更多表单

来认识更多的表单吧,增加知识面 我只创建了一个index.html帮助你认识它们 以下是代码 <!DOCTYPE html> <html> <head> <meta charset = "utf-8"> </head> <body> <!--单按钮输入(单选)--> <form action = "" method = "POST"> <inpu…

#WEB安全基础 : HTML/CSS | 0x10实现交互_表单

先看看表单如何工作吧 请求   响应   简要工作流程: 浏览器加载页面 用户输入数据 用户提交表单 服务器响应 概念都清楚了,我们来写表单吧 只有一个html文件   这是显示   你可以向空白框框里写一些东西,然后点击提交 数据会发到web服务器的contest.php里,当然了,你也可以自己写一个php文件 下面是index.htm的l代码 <!DOCTYPE html> <html> <head> <meta charset = "utf-8&q…

#WEB安全基础 : HTML/CSS | 0x9美丽的饮料店

我带着你,你带着钱,咱们去喝点饮料吧. 老板久仰你的大名,请你帮忙设计一个网站宣传他的饮料店 你要制定一个完美的方案还需要多学点东西 我先帮你设计一下 这是存放网站的文件夹 这是根目录   这是about文件夹   这是beverages文件夹   存放CSS文件的文件夹(这是外部调用所以需要一个CSS文件,我们以前写的网页都是内部调用)   存放图片的images文件夹   首先,我要展示我写的index.html   以下是代码 <!DOCTYPE html> <html> &…

#WEB安全基础 : HTML/CSS | 0x8.1CSS继承

CSS的一大特性——继承,怎么样没听说过吧,没了它我们修饰网页时就变得十足的麻烦 这是本节课准备的文件   这是others文件夹   先看看index.html,代码如下 <!DOCTYPE html> <html lang ="zh"> <head> <meta charset = "utf-8"> <title>TEST</title> <style> p{ color: re…

#WEB安全基础 : HTML/CSS | 0x8CSS进阶

你以为自己学这么点CSS就厉害了? 学点新东西吧,让你的网页更漂亮 我们只需要用到图片和网页   这是index.html的代码 <html> <head> <title>Head First Lounge</title> </head> <style> body{ margin-left: 15%; margin-right: 15%; font-family: sans-serif; padding: 10px 10px 10px…

#WEB安全基础 : HTML/CSS | 0x7HTML5和W3C验证

标准,标准,什么都有标准 你听说过HTML5吗?这是一个新版本,当然也有新标准 我只准备了一个index.html文件 以下是代码 <!DOCTYPE html> <!--告诉浏览器这是一个html文件--> <html> <head> <meta charset = "utf-8"> <!--WEB页面指定的编码是utf-8--> <title>TEST</title> <style…

#WEB安全基础 : HTML/CSS | 0x6嵌套标签(图片链接)

嵌套标签我们已经讲一次了,在0X4.1里,我们把列表嵌套了 你觉得文字链接难看得令人作呕,好,你再也不会有这种感觉了   一如既往,一个html文件和一个存放图片的文件夹 index.html的代码,很简单 <html> <head> <title>TEST</title> </head> <body> <p> <a href = "http://www.baidu.com/" title = &…

#WEB安全基础 : HTML/CSS | 0x5a标签拓展和class、id属性的使用

a标签不只是能链接到其他网页,也能链接到网页中的元素 class属性让你用CSS对特定的元素进行修饰 这些是一个网页设计者的有力武器 这节课还是一个index.html文件   以下是代码 <html> <head> <title>TEST</title> </head> <style> h1.mh1{ color: green; } </style> <body> <a href = "htt…

#WEB安全基础 : HTML/CSS | 0x4.1嵌套列表

如果你认为列表只有ul和ol那你就错了 我要为你展示新的列表 这次只有一个index.html文件 这是它的效果 以下是它的代码 <html> <head> <title>TEST</title> </head> <body> <!--嵌套列表--> <p> 嵌套列表 </p> <ol> <!--在<ol>以内并且在<ul>以外的<li>属于有序…