添加一條屬性，它能夠繪制一個矩形框。它可以指定矩形邊的顏色，邊的寬度，邊的樣式，以及矩形區域。如：
picl:blue solid 2px rect(100px 300px 300px 100px);
picl為屬性名稱，blue為邊的顏色，solid為邊 的樣式，2px為邊的寬度，rect(100px 300px 200px 50px)為矩形區域。

步驟：

（1）.通過在 css/CSSPropertyNames.in文件中增加一個屬性名的關鍵字；
（2）.使用perl命令(#perl makeprop.pl)，生成對應的.cpp和.h文件，這兩個文件包含了屬性名和屬性ID，以及屬性名的查找規則;
（3）.將（2）中生成 的兩個文件拷貝到generated/ 目錄下；
（4）.在CSSStyleSelector.cpp， CSSParser.cpp兩個文件中提供了屬性ID對應的接口:(中間一些具體處理不詳細闡述，這里只說明總體步驟)

a.在 CSSParser.cpp中的“bool CSSParser::parseValue(int propId, bool important)”函數中增加“case CSSPropertyPicl: ”以及對應的處理代碼，它是網頁上css樣式中我們自定義屬性“picl”的解析的入口；
說明：以此函數為起點，將picl中各種值進行解析，判 斷值是否合法。如果合法，將其進行保存，保存后會更新css樣式。我們所關心的是如何取出picl屬性的各個值，以及怎樣進行保存，我們不必去修改與樣式 更新有關的代碼，當解析完后，瀏覽器會更新css樣式，丟棄無效的樣式，只保留合法（有效）的樣式。由于picl屬性是復合屬性，添加本條屬性只需調用這 個文件中的“bool CSSParser::parseShorthand(int propId, const int *properties, int numProperties, bool important)”函數，它就會完成它里面對應的各種單一屬性的解析。
b.如果屬性是單一 屬性，必須在CSSStyleSelector.cpp中的“void CSSStyleSelector::applyProperty(int id, CSSValue *value)”函數中添加對應的case語句，它是css樣式執行的入口。由于我們添加的屬性是一條復合屬性，它在執行時會通過它里面的單一屬性進行執 行。因此，在CSSStyleSelector.cpp中的“void CSSStyleSelector::applyProperty(int id, CSSValue *value)”函數中不必添加本條屬性對應的case語句。
說明：我借助了border屬性的方法來保存“邊的顏 色，邊的寬度，邊的樣式”，我們主要需要做的是對矩形值的處理，以及設置一個執行我們的“picl”屬性的標志。我添加了一個單一屬性：hic，它主要保 存矩形的四個值。在CSSStyleSelector.cpp中，“邊的顏色，邊的寬度，邊的樣式”這三個值由類似border屬性處理方式進行了傳遞， 矩形的值通過“ case CSSPropertyHic: ”來傳遞，當“picl”屬性的標志被激活時，則取出picl屬性的各個值，做如下處理：
paintInfo.context->setStrokeColor(); 設置邊的顏色；
paintInfo.context->setStrokeThickness(); 設置邊的寬度；