WEB-HTML&CSS
时间：2023-03-31 12:04:20
CSS
1HTML1.1概述HTML指的是超文本标记语言（HyperTextMarkupLanguage）HTML不是一种编程语言，而是一种标记语言（markuplanguage），是一组标记标签_（markuptag）HTML使用_markup标签_来描述网页1.2标签1.2.1Image:width属性：用于指定图片的宽度，单位可以是px（像素），或%（百分比）height属性：用于指定图片的高度，单位可以是px（像素），或者%（百分比）1.2.2超链接：target属性：是用于指定如何打开超链接，常用值为：_self：默认值，在当前窗口打开超链接_blank：在新窗口打开超链接百度你不知道！1.2.3Tablecolspan="2"横向合并rowspan="2"纵向合并| Header1 | 标题2 | 标题3 |
|---|
| 内容 | Content | Content |
1.2.4表单：表单用于向服务器提交和发送数据。表单项标签：输入表单元素：功能：设置文本框、密码框、单选、多选、下拉框、文件提交（可输入）、颜色选择、日期选择。该功能取决于type单选按钮选择的类型：输入同名单选Checkbox:
全选取消
select/option元素：select标签用于定义一个下拉选择框。option用于定义下拉框中的选项。北京上海2CSS2.1概述CSS指的是级联样式表(_C_ascading_S_tyle_S_heets)样式定义_如何显示_HTML元素样式通常存储在一个_样式表中。样式被添加到HTML4.0以解决内容和表示分离的问题。__外部样式表_可以大大提高工作效率。外部样式表通常存储在_CSS文件中的多个样式定义可以级联为一个2.2在HTML中引入CSS方法一：通过style属性导入css这是通过标签上的style属性为当前标签设置样式,代码示例:Thisisadiv...
因为这样代码不能复用（如果多个元素需要相同的样式，每个标签需要设置一次），而当样式代码过多时，容易造成页面结构的混乱，不利于后期的扩展和维护。方法二：通过style标签导入css。在head标签内提供一个样式标签。可以在样式标签内选择和修改元素。代码示例：这种方法是将所有的css样式代码集中到一个style标签统一管理，初步实现了html代码与css代码的融合分离，实现代码复用。而且它没有弄乱页面结构。推荐这个方法！方法三：通过link导入外部css文件在head标签下添加一个link标签，link标签可以导入外部css文件。代码如下：在html中导入css文件：
demo.css文件内容:@charset"UTF-8";**p**{border:2pxsolidblue;color:red;font-family:"ChineseAmber";text-indent:50px;}这种方式是将所有的css代码集中在在一个css文件中统一管理，真正实现了html代码和css代码的分离。实现了代码重用。推荐这个方法！2.3CSS选择器所谓选择器就是一种可以帮助我们在HTML中选择要修改的元素的技术。标签名称选择器根据标签（元素）的名称选择指定名称的标签进行样式修改！格式：标签名/元素名{几个css属性...}span{/*选择当前html中的所有span元素*//class选择器通过标签上的公共属性class为标签指定类（组）,并且具有相同类值的所有元素组成一个组。可以通过class属性值来选择本组元素，并为本组元素统一设置样式。格式：.classvalue{Severalcssattributes...}.s1{/*选择所有class值为s1的元素*/}.s2{/*选择所有class值为s2的元素*/}另外，一个label/一个元素可以设置多个class值，表示当前元素同时属于多个组，例如：
span111如果多个class设置的样式冲突，因为浏览器按照上面的顺序解析html内容，所以后面的样式会覆盖前面的样式。id选择器通过标签上的公共属性id为标签设置唯一标识（id的值在整个html中应该是唯一的），所以可以通过id值来唯一选择一个元素。格式：#idvalue{几个css属性...}#p1{}后代选择器选择父元素内部的指定后代元素格式：Selectordescendantelement{几个css属性...}pspan{/*选择父元素Allspan元素里面的元素*/}属性选择器根据选择器加上元素的属性条件选择元素进行修改！格式：selectorattributecondition1..{severalcssattributes...}input[type='text']{/*选择所有type属性值为text的input元素*/}2.4常用属性汇总可以参考w3c随时。文本属性字体属性背景属性边框（border）
