web
关注
分享
扫一扫
web学习啊
xcdq
enjoy
展开
-
【web初步】浮动(float)
让多个盒子(div)水平排列成一行，使得浮动成为布局的重要手段。可以实现盒子的左右对齐等等…浮动最早是用来控制图片，实现文字环绕图片的效果。在 CSS 中，通过 float 中文， 浮 漏 特 属性定义浮动，语法如下：选择器 { float: 属性值; }属性值描述none元素不浮动（默认值）left元素向左浮动right元素向右浮动...原创 2020-04-10 13:58:04 · 1702 阅读 · 0 评论 -
【web初步】盒子模型（Box Model）
盒子边框（border）border : border-width || border-style || border-color 属性作用border-width定义边框粗细，单位是pxborder-style边框的样式border-color边框颜色边框的样式：none：没有边框即忽略所有边框的宽度（默认值）solid：边框为单实线(最...原创 2020-04-07 23:08:55 · 670 阅读 · 0 评论 -
【web初步】CSS 背景(background)
背景颜色(color)background-color:颜色值; 默认的值是 transparent 透明的背景图片(image)background-image : none | url (url) 参数作用none无背景图（默认的）url使用绝对或相对地址指定背景图像背景图片后面的地址，url不要加引号背景平铺（repeat）backg...原创 2020-04-07 17:55:13 · 325 阅读 · 0 评论 -
【web初步】标签显示模式（display）
块级元素(block-level)独占一行高度，宽度、外边距以及内边距都可以控制宽度默认是容器（父级宽度）的100%是一个容器及盒子，里面可以放行内或者块级元素。p 里面不能放块级元素，特别是 p 不能放divh1~h6,dt，他们都是文字类块级标签，里面不能放其他块级元素。常见的块元素有<h1>~<h6>、<p>、...原创 2020-04-07 17:28:11 · 663 阅读 · 0 评论 -
【web初步】css字体文本属性
设计字体样式font_size: 12px; //设置字体大小可以使用相对长度单位，也可以使用绝对长度单位。通常使用em（相对当前对象内文本字体尺寸）px（像素）font-family: xxxx; //定义字体类型可以同时指定多个字体，中间以逗号隔开，表示如果浏览器不支持第一个字体，则会尝试下一个，直到找到合适的字体， 如果都没有，则以我们电脑默认的字体为准。font-we...原创 2020-04-07 17:10:25 · 316 阅读 · 0 评论 -
【web初步】伪类选择器
伪选择器包括伪类选择器和伪对象选择器。伪选择器能够根据元素或对象的特征、状态、行为进行匹配。伪选择器以冒号（:）作为前缀标识符。冒号前可以添加限定选择符，限定伪类应用的范围，冒号后为伪类和伪对象名，冒号前后没有空格。用于向某些选择器添加特殊的效果。比如给链接添加特殊效果， 比如可以选择 第1个，第n个元素。链接伪类选择器伪类作用a:link...原创 2020-04-07 17:01:42 · 361 阅读 · 0 评论 -
【web初步】复合选择器
可以更准确更精细的选择目标元素标签后代选择器选择元素或元素组的子孙后代把外层标签写在前面，内层标签写在后面，中间用空格分隔，先写父亲爷爷，在写儿子孙子。 .class h3{color:red;font-size:16px;}能选择任何包含在内的标签。子元素选择器子元素选择器只能选择作为某元素**子元素(亲儿子)**的元素其写法就是把父级标签写在前面，子...原创 2020-04-07 16:06:23 · 398 阅读 · 0 评论 -
【web初步】元素选择器
标签选择器标签选择器也称为类型选择器，它直接引用HTML标签名称，用来匹配同名的所有标签。优点：使用简单，直接引用，不需要为标签添加属性。缺点：匹配的范围过大，精度不够。一般常用标签选择器重置各个标签的默认样式。p{ font-size:12px; color:red;}类选择器类选择器以点号（.）为前缀，后面是一个类名。在标签中定义class属性后，设置属...原创 2020-04-07 15:37:18 · 331 阅读 · 0 评论 -
【web初步】引入CSS样式表
行内式（内联样式）通过标签的style属性来设置元素的样式<标签名 style="属性1:属性值1; 属性2:属性值2; 属性3:属性值3;"> 内容 </标签名>内部样式表（内嵌样式表）是将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义<head><style> div { color: red...原创 2020-04-07 15:34:50 · 365 阅读 · 0 评论 -
sublime快捷操作emmet语法
生成标签 直接输入标签名 按tab键即可 。 比如 div 然后tab 键， 就可以生成 <div></div>生成多个相同标签 加上 * 就可以了 比如 div*3 然后tab 键就可以快速生成3个div父子级关系的标签，可以用 > 比如 ul > li然后tab 键兄弟关系的标签，用 + 就可以了 比如 div...原创 2020-04-07 15:33:31 · 203 阅读 · 0 评论 -
【web初步】表单
input控件<input type="属性值" value="你好">type属性这个属性通过改变值，可以决定了你属于那种input表单。value属性 值value 文本值。 有些表单刚打开页面就默认显示几个文字，就可以通过这个value 来设置。name属性name属性后面的值，是我们自己定义的。radio 如果是一组，我们必须给他们...原创 2020-04-07 14:29:54 · 97 阅读 · 0 评论 -
【web初步】简单的登入注册界面
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div{ width: 100px; he...原创 2020-03-30 15:14:06 · 999 阅读 · 0 评论 -
【web初步】CSS样式
设计字体样式font-family: xxxx; //定义字体类型font_size: 12px; //设置字体大小color: red; //定义字体颜色font-weight: 600; //定义字体粗细font-style :normal|italic|oblique; //定义字体倾斜效果,normal为默认值，表示正常的字体，italic表示斜体；oblique表...原创 2020-03-26 12:43:49 · 153 阅读 · 0 评论 -
【web初步】CSS特性
继承性CSS继承性是指后代元素可以继承祖先元素的样式。继承样式主要包括字体、文本等基本属性，如字体、字号、颜色、行距等下面类型属性是不允许继续的：边框、边界、补白、背景、定位、布局、尺寸等。层叠性CSS层叠性是指CSS能够对同一个对象应用多个样式的能力。当CSS属性冲突时会根据权重对选择器进行覆盖标签选择器：权重值为1。伪元素或伪对象选择器：权重值为1。类选择器：权重值为10。...原创 2020-03-26 11:56:42 · 175 阅读 · 0 评论 -
【web初步】CSS选择器
元素选择器标签选择器标签选择器也称为类型选择器，它直接引用HTML标签名称，用来匹配同名的所有标签。优点：使用简单，直接引用，不需要为标签添加属性。缺点：匹配的范围过大，精度不够。一般常用标签选择器重置各个标签的默认样式。p{ font-size:12px; color:red;}类选择器类选择器以点号（.）为前缀，后面是一个类名。在标签中定义class属...原创 2020-03-25 10:44:11 · 259 阅读 · 0 评论 -
【web初步】表格
<table>：定义表格。在<table>标签内部可以放置表格的标题、表格行、表格列、表格单元以及其他表格对象。 <caption>：定义表格标题。<caption>标签必须紧随<table>标签之后。只能为每个表格定义一个标题。通常这个标题会被居中显示在表格之上。 <th>：定义表头单元格。<th&...原创 2020-03-24 14:21:12 · 191 阅读 · 0 评论 -
（web初步）列表与链接
无序列表<ul> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li> <li>aaaa</li></ul>有序列表<ol> &...原创 2020-03-23 22:17:42 · 218 阅读 · 0 评论 -
（web初步）结构化文本
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><!--<h1><h2>...到h6可定义标题，一般后三个不...原创 2020-03-21 11:32:01 · 283 阅读 · 0 评论 -
（web初步）CSS3实现旋转木马效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&...原创 2020-03-11 11:04:47 · 722 阅读 · 2 评论 -
（web初步）CSS3实现盒子3D翻转效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&...原创 2020-03-11 10:39:20 · 969 阅读 · 0 评论