border-radius 這個屬性可以設(shè)置邊角圓潤,W3c里面一查就明白了
創(chuàng)新互聯(lián)公司于2013年成立,先為沈河等服務(wù)建站,沈河等地企業(yè),進行企業(yè)商務(wù)咨詢服務(wù)。為沈河企業(yè)網(wǎng)站制作PC+手機+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。
沒有代碼沒發(fā)給你解釋,因為不同人寫程序的思路可能不太一樣
首先貼出HTML5頁面的代碼:
!DOCTYPE html
html
head
meta charset="UTF-8" /
titleCanvas案例/title
/head
script type="text/javascript" src="script.js"/script
body onload="draw('canvas')"
h1Canvas案例/h1
canvas id='canvas' width="400" height="300" /
/body
/html
在這個頁面中我們寫了一個canvas元素。該元素的ID為canvas。然后鏈接了script.js這個文件。
//script.js
function draw(id)
{
var canvas = document.getElementById(id);
if(canvas==null){
return false;
}
var context = canvas.getContext('2d');
context.fillStyle="#eeeeff";
context.fillRect(0,0,400,300);
context.fillStyle='rgba(255,0,0,0.25)';
context.translate(200,50);
createFiveStar(context);
context.fill();
}
function createFiveStar(context){
var dx = 0;
var dy = 100;
var s = 50;
context.beginPath();
var x = Math.sin(0);
var y = Math.cos(0);
var dig = Math.PI/5*4;
for(var i=0;i5;i++){
var x = Math.sin(i*dig);
var y = Math.cos(i*dig);
context.lineTo(dx+x*s,dy+y*s);
}
context.closePath();
}
我們提供了兩個方法一個是draw方法。當頁面加載完成的時候就會執(zhí)行draw方法中的內(nèi)容。
而draw方法中呢又會執(zhí)行createFiveStart函數(shù)。
下面我來分析下createFiveStart函數(shù)的內(nèi)容:
function createFiveStar(context){
var dx = 0;//畫出來的五角星x偏移位置
var dy = 100;//畫出來的五角星y偏移位置
var s = 50;//畫出來的五角星的大小
context.beginPath();//開始路徑繪制
var x = Math.sin(0);//默認的x坐標
var y = Math.cos(0);//默認的y坐標
var dig = Math.PI/5*4;//弧度值
for(var i=0;i5;i++){
var x = Math.sin(i*dig);
var y = Math.cos(i*dig);
context.lineTo(dx+x*s,dy+y*s);//劃線
}
context.closePath();//結(jié)束路徑
}
好了到了這里我們就完成了HTML5中,五角星的繪制。
這個由瀏覽器默認設(shè)定,不同的瀏覽器不一樣,有的瀏覽器是黑色圓點,有的瀏覽器是星號,不可以修改。除非你自己用代碼實現(xiàn)這樣的功能,沒有說哪個屬性或樣式一設(shè)置就可以這么簡單。
自己實現(xiàn)可以用js的replace或者用html5的placeholder之類的東西來實現(xiàn)。思路是將用戶輸入的東西復制到另外一個隱藏元素中。同時修改可見的輸入框的內(nèi)容。
當前名稱:html5星星,html5星星閃爍
URL網(wǎng)址:http://chinadenli.net/article18/dsdecgp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供面包屑導航、手機網(wǎng)站建設(shè)、軟件開發(fā)、移動網(wǎng)站建設(shè)、做網(wǎng)站、自適應(yīng)網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)