HTML & CSS

原创 2015年11月18日 13:02:56



*****************************************************************************************************************

字体:font-family值要加引号;
字号:font-size;
颜色:color;
粗体:font-weight;
斜体:font-style:italic;
下划线,删除线:text-decoration:underline;or text-decoration:line-through;
缩进:text-indent;
行间距:line-height;
对齐方式:text-align;
字母间的间距:letter-spacing;
单词间隔:word-spacing;


<table>代表表格</table>

<tr>代表表格中的一行</tr>

<td>代表表格中的一列</td>

'tr'与'td'交成一个单元格

<table>...</table>之间有多少个<tr>,就有多少行

<tr>...</tr>之间有多少个<td>,就有多少列

*******************************************************************************************************************

在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。
常用的块状元素有:
<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>

常用的内联元素有:
<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

常用的内联块状元素有:
<img>、<input>


******************************************************************************************************************

CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。


如下列代码:

p{
   font-size:12px;
   color:red;
   font-weight:bold;
}

使用CSS样式的一个好处是通过定义某个样式,可以让不同网页位置的文字有着统一的字体、字号或者颜色等


******************************************************************************************************************

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>认识CSS样式</title>
<style type="text/css">
p{
   font-size:12px;/*设置文字字号*/
   color:red;/*设置文字颜色*/
   font-weight:bold;/*设置字体加粗*/
}
</style>
</head>
<body>
<p>一枝梨花压海棠</p>
</body>
</html>


******************************************************************************************************************

html的<select>标签,如何获取当前选中的项的内容和当前选中的值?


看例子,来自慕课网链接

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
    </head>
    <body>
        <h3>获取处于选中状态元素的内容</h3>
        <form id="frmTest" action="#">
        <select name="ip_protocol" id="select" >
            <option value="0">苹果</option>
            <option value="1">桔子</option>
            <option value="3">葡萄</option>
            <option value="4">香蕉</option>
          	<option value="IP" id="8061">IP</option>
			<option value="IPV6" id="8062">IPV6</option>
			<option value="IPV4V6" id="8063">IPV4V6</option>
        </select><br /><br />
        <div id="tip"></div>
        </form>
        
        <script type="text/javascript">
            var txtOpt = $("select[name = ip_protocol]").text();
            document.write(txtOpt);
            
            var v = document.getElementById('select').selectedIndex;
            document.write("| " + v);          
        </script>
    </body>
</html>



一个例子 链接

比如下边的代码,若当前选中了第一项“一月”,如何获取字符串“一月”呢?

<select>
    <option value=0>一月</option>
    <option value=1>二月</option>
    <option value=2>三月</option>
</select>

原生js


document.getElementById('select').options[document.getElementById('select').selectedIndex].text;





版权声明:本文为博主原创文章,未经博主允许不得转载。

html + css + js初步简单学习笔记

html: 这个是HTML5的根元素。可以省略 注意每个文件最多只有一个根元素 页面头部分,可以省略 引入样式 标题1-6字体越来越小 定义的是段落 可以指定id class style...
  • JerroLuo
  • JerroLuo
  • 2016年07月27日 11:06
  • 3760

如何在 HTML 中应用 CSS基础详解

接下来用这个 index.html 将在下文讲解中用到。 h2 tag class1 class2 h2 in main 如何在 HTML 中应用 ...
  • qq_21792169
  • qq_21792169
  • 2016年03月20日 01:24
  • 3499

css与html的三种结合方式

Insert title here
  • u011080770
  • u011080770
  • 2014年05月08日 10:55
  • 2358

html+css+js基础学习

首先我们先从最基本的前端知识入手 html+css+JavaScript 很多人喜欢一上来,就从书本开始啃,例如JavaScript书随便一本那么厚, 等你啃完了,你的学习热情就没了,而且容易学了...
  • huangxiaominglipeng
  • huangxiaominglipeng
  • 2016年08月12日 11:27
  • 7686

史上最全的HTML、CSS知识点总结,浅显易懂。

Javaweb、HTML+css知识点总结,浅显易懂,你把这些看完了,HTML和css知识点你也就会了。...
  • qiushi_1990
  • qiushi_1990
  • 2014年10月19日 10:00
  • 10346

各大互联网公司前端笔试面试题–HTML,CSS篇

Html篇: 1.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?  IE: trident内核  Firefox:gecko内核  Safari...
  • u013184759
  • u013184759
  • 2016年08月22日 09:39
  • 4150

变化多端 – 多种纯CSS的HTML表格设计

介绍 在HTML中,Table节点由于其层层嵌套的节点结构,一度名声很臭,且一度被呼吁用DIV+CSS取而代之。但在实际项目开发中,一碰到规整的数据显示,不知不觉又会用起它。可见其生命力之顽强。 这...
  • eengel
  • eengel
  • 2015年08月03日 20:00
  • 14431

html+css快速入门教程

前端工程师应该掌握的基本技术:HTML+CSS+JavaScript1 HTML简介1.1. 什么是HTML?(了解)HTML是超文本标记语言(HyperText Markup Language,HT...
  • keledon
  • keledon
  • 2017年06月07日 19:09
  • 794

html 和css常见的面试题

1、常见的块级元素  内联元素 div -最常用的块级元素      dl - 和dt-dd 搭配使用的块级元素      form - 交互表单      h1 -h6- 大标题...
  • a_li_li
  • a_li_li
  • 2017年03月22日 14:04
  • 1295

html css入门书籍推荐

好尴尬,最近找工作,一直遇到培训机构,妹的。。。。只能慢慢找了 首先,希望大家有基本的html以及css的基础来看下面基本书: 1.html5秘籍 2.css3实战 3.jav...
  • HUSHILIN001
  • HUSHILIN001
  • 2017年03月05日 16:44
  • 746
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:HTML & CSS
举报原因:
原因补充:

(最多只允许输入30个字)