- 博客(15)
- 资源 (7)
- 收藏
- 关注
原创 前端开发系列(十六)网页布局教程(2)
一、 结构与表现相分离的思想1.1、微博用户发言信息列表制作代码示例:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/...
2019-01-15 21:27:04 2455 1
原创 前端开发系列(十五)网页布局教程(1)
一、用HTML+CSS实现最简单的网页布局效果:一列布局代码示例:&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;&lt;html xmlns="http://w
2019-01-15 20:55:28 1161
原创 前端开发系列(十四)CSS教程(9)
一、CSS样式设置小技巧1.1、水平居中设置-行内元素我们在实际工作中常会遇到需要设置水平居中的场景,比如为了美观,文章的标题一般都是 水平居中 显示的。这里我们又得分两种情况:行内元素 还是 块状元素 ,块状元素里面又分为定宽块状元素,以及不定宽块状元素。今天我们先来了解一下行内元素怎么进行水平居中?如果被设置元素为文本、图片等行内元素时,水平居中 是通过给父元素设置 text-ali...
2019-01-09 20:48:58 2126 2
原创 前端开发系列(十三)CSS教程(8)
一、CSS代码缩写,占用更少的带宽1.1、颜色值缩写关于颜色的css样式是可以缩写的,当你设置的颜色是16进制的色彩值时,如果每两位的值相同,可以缩写一半。例子1: p{color:#000000;}可以缩写为: p{color: #000;}例子2: p{color: #336699;}可以缩写为: p{color: #369;}1.2、字体缩写网页中的字体 css 样式代码...
2019-01-09 20:07:27 427
原创 前端开发系列(十二)CSS教程(7)
一、CSS布局模型1.1、css布局模型 清楚了 CSS 盒模型的基本概念、 盒模型类型, 我们就可以深入探讨网页布局的基本模型了。布局模型与盒模型一样都是 CSS 最基本、 最核心的概念。 但布局模型是建立在盒模型基础之上,又不同于我们常说的 CSS 布局样式或 CSS 布局模板。如果说布局模型是本,那么 CSS 布局模板就是末了,是外在的表现形式。CSS包含3种基本的布局模型,用英文概...
2019-01-09 19:39:13 484
原创 前端开发系列(十一)CSS教程(6)
一、CSS盒模型1.1、元素分类 在讲解 CSS 布局之前,我们需要提前知道一些知识,在 CSS 中,html 中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素常用的块状元素有:&amp;amp;lt;div&amp;amp;gt;、&amp;amp;lt;p&amp;amp;gt;、&amp;amp;lt;h1&amp;amp;gt;...&amp;
2019-01-08 22:14:00 407 1
原创 前端开发系列(十)CSS教程(5)
一、 CSS格式化排版1.1、文字排版--字号、颜色/h2&amp;amp;amp;amp;amp;gt; 我们可以使用 css 样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体。body{font-family:&amp;amp;amp;amp;quot;宋体&amp;amp;amp;amp;quot;;}注意:不要设置不常用的字体,因为如果用户本地电脑上如果没有安装你设置的字体,就
2019-01-08 21:04:47 381
原创 前端开发系列(九)CSS教程(4)
一、 CSS的继承、层叠和特殊性1.1、继承 CSS 的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定 html 标签元素,而且应用于其后代。比如下面代码:如某种颜色应用于 p标签,这个颜色设置不仅应用 p标签,还应用于 p标签 中的所有子元素文本,这里子元素为 span标签。p{color:red;}&lt;p&gt;三年级时,我还是一个&lt;s...
2019-01-08 20:19:38 318
原创 前端开发系列(八)CSS教程(3)
一、CSS选择器1.1、什么是选择器?每一条css样式声明(定义)由两部分组成,形式如下:选择器{&amp;amp;amp;amp;nbsp; &amp;amp;amp;amp;nbsp;&amp;amp;amp;amp;nbsp;&amp;amp;amp;amp;nbsp; 样式;}在 { } 之前的部分就是 “选择器”,“选择器” 指明了 { } 中的**“样式”** 的作用对象,也就是 “样式” 作用于网页中的哪些元素。比如
2019-01-08 19:29:09 340 2
原创 前端开发系列(七)CSS教程(2)
一、CSS样式基本知识1.1、内联式 css 样式,直接写在现有的HTML标签中CSS 样式可以写在哪些地方呢?从 CSS 样式代码插入的形式来看基本可以分为以下3种:内联式、嵌入式和外部式三种。这一小节先来讲解内联式。内联式css样式表就是把css代码直接写在现有的HTML标签中,如下面代码:&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp; &amp;lt;p style=&am
2019-01-08 13:45:18 375
原创 前端开发系列(六)CSS教程(1)
一、开始学习CSS,为网页添加样式1.1、认识CSS样式 CSS 全称为 “ 层叠样式表 ( Cascading Style Sheets ) ”,它主要是用于定义 HTML 内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。代码示例:&lt;!DOCTYPE HTML&gt;&lt;html&gt; &lt;head&gt; &lt;meta http-equiv=&a
2019-01-07 21:14:13 384
原创 前端开发系列(五)HTML教程(5)
一、与浏览者交互,表单标签1.1、使用表单标签,与用户交互网站怎样与用户进行交互?答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。语法:&lt;form method="传送方式" action="服务器文件"&gt;1、&lt;form&gt; :&lt;form&
2019-01-07 20:37:25 380
原创 前端开发系列(四)HTML教程(4)
一、认识标签(第三部分)1.1、使用 a 标签,链接到另一个页面 使用 &amp;lt;a&amp;gt; 标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这个标签。语法:&amp;lt;a href=&quot;目标网址&quot; title=&quot;鼠标滑过显示的文本&quot;&amp;gt;链接显示的文本&amp;lt
2019-01-07 14:14:02 311
原创 前端开发系列(三)HTML教程(3)
一、认识标签(第二部分)1.1、使用 ul,添加新闻信息列表代码示例:&amp;lt;!DOCTYPE HTML&amp;gt;&amp;lt;html&amp;gt;&amp;lt;head&amp;gt;&amp;lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;tex
2019-01-07 13:39:42 363
原创 前端开发系列(二)HTML教程(2)
一、认识标签(第一部分)1.1、body 标签,网页上显示的内容放在这里网页上要展示出来的页面内容一定要放在 body 标签中。代码示例:&lt;!DOCTYPE HTML&gt;&lt;html&gt;&lt;head&gt; &lt;meta http-equiv="Content-Type" content="text
2019-01-04 20:54:23 524
CyberDuck For Mac
2018-03-23
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人